オーディオフォルダの残りの部分でディブを呼び出します🔈

ねえ@ mrdoob 、examplesフォルダ内のスクリプトをどのように処理するかを明確にしていただけますか？

＃19989をそのまま変換するのが好きですが、そうすることで、その作業を上書きせずにutils/modularize.jsをexamples/jsフォルダーで使用できなくなったことに気付きました。 これは、 examples/jsを維持する私たちの終わりと、 examples/jsmだけの始まりを示していますか？

編集：コメントを参照

数学フォルダの残りの部分で作業できますか？

数学フォルダの残りの部分で作業できますか？

私はあなたがそれにショットを与えるためにすべてです。 しばらく前にやろうとしたのを覚えていますが、 @ Mugen87は結局それを教えてくれました。 フォルダー全体を一度に変換すると、大雑把なことになりかねないので、その簡単な要約をテストしました。 部分的、またはファイルごとにさえ、私は確信しています。

@DefinitelyMaybe src/animation/の下で他に何を移行できるかがわかります

src/coreの一部： https ：//github.com/mrdoob/three.js/pull/20008

良い。 フォルダーはほぼ完成していると思います。 src/core/Object3D.jsとsrc/core/BufferGeometry.jsが残っているだけでしょうか？

src/core/Object3D.jsとsrc/core/BufferGeometry.jsが残っているだけでしょうか？

はい、 Object3DとBufferGeometryに依存するES5クラスはたくさんあります。

レンダラー： https ：//github.com/mrdoob/three.js/pull/20011

シュート、これには驚くべき進歩がありました🎉

src/lightsでディブを呼び出します。 上記のリストでsrc/extrasとsrc/renderersを開くと、それぞれに2つのフォルダーがあります。

やあみんな、

このパターンに関して私たちは何をしていましたか？

foo.prototype = Object.assign( Object.create( bar.prototype ), {
    ...
    isDirectionalLight: true,
    ...
} );

今ですか：

class foo extends bar {
  static isDirectionalLight = true;
  constructor(  ) {
    ...
  }
}

また

class foo extends bar {
  constructor(  ) {
    this.isDirectionalLight = true;
  }
}

現在、2回目はやっていますが、見てみると、1回目が近かったのではないかと思います。

そもそもこれらの変数を何が使用していたか知っている人はいますか？

class foo extends bar {
  constructor(  ) {
    this.isDirectionalLight = true;
  }
}

☝️これは正しいです。 isDirectionalLightは良い例で、次のように使用されます。

$ git grep 'isDirectionalLight\b' src/ examples/js ':!*.ts'
examples/js/exporters/GLTFExporter.js:                  if ( light.isDirectionalLight ) {
examples/js/exporters/GLTFExporter.js:                  } else if ( object.isDirectionalLight || object.isPointLight || object.isSpotLight ) {
examples/js/renderers/SVGRenderer.js:                   } else if ( light.isDirectionalLight ) {
examples/js/renderers/SVGRenderer.js:                   if ( light.isDirectionalLight ) {
src/lights/DirectionalLight.js: isDirectionalLight: true,
src/renderers/webgl/WebGLLights.js:                     } else if ( light.isDirectionalLight ) {

とはいえ、いくつかのプロトタイプのプロパティを保持することでパフォーマンスが向上する可能性があります...

class foo extends bar {
}
foo.prototype.baz = heavyThing;

たぶん、PRのそれらをケースバイケースでレビューすることができます。

src/renderers/webglで撮影します👍👍

頑張って、楽しんでください。 その中でかなりのことが起こっている

webxr： https ：//github.com/mrdoob/three.js/pull/20038

やあみんな-私はsrc/renderers/webgl変換しました。 クレイジーでした。 PRのプッシュを開始する前に、すべてを確認し、＃20039を待ちます。

👍
楽しみにしています

@yomotsuが数学PRのis*プロパティに読み取り専用ゲッターを使用していることに気づきました...多分それが最高です！

class foo extends bar {
  get isDirectionalLight() {
    return true;
  }
}

うーん、そうかもしれません。 他の人が変数を変更できないようにするために場所で試みたことを私は知っています。 これは私にはかなりまともなパターンのように見えます。

クイックjsfiddleショーケース

これが進むべき道のようです：

foo.prototype.isDirectionalLight = true;

src/objectsを調べます。 物事を壊さずにどこまで行けるかがわかります。

数学フォルダが完成しました。
（補間クラスは除外されます。 ）

やあみんな、
私はsrc/objectsを介して作業を取り戻すつもりです、他の誰かがその間にそれを拾うことを歓迎します。

ねえ、この人たちと一緒に良い仕事を！ 💪

たった1つの問題ですが、クラスがその場で変更されているため、 foo.prototype.isDirectionalLight = true;ではまだツリーシェイクが許可されていません。
また、この時点では、現在クラスを使用しており、プロトタイプを抽象化できるため、プロトタイプにはもう触れないことを強くお勧めします。

このパターンはどうですか？ それは私には最も明白に見えます。

constructor( x = 0, y = 0, z = 0 ) {

  Object.defineProperty( this, 'isVector3', {
    value: true,
    enumerable: false,
    writable: false,
    configurable: false,
  } );

同じことをしますが、もう少し暗黙的な短いバージョンもあります。

constructor( x = 0, y = 0, z = 0 ) {

  Object.defineProperty( this, 'isVector3', { value: true } );

@marcofugaro短いバージョンは私には良さそうです👍

わかりました、PRをしました。

また、このPRによってブロックされているため、クラスフィールドを使用できないことに気づきました。

より人気のある@rollup / plugin-babelを使用するようにビルドパイプラインを更新できます

より人気のある@rollup / plugin-babelを使用するようにビルドパイプラインを更新できます
必要に応じてその問題を修正してください。

ええ、PRができたらいいですね🙏

@ marcofugaro 、 @ mrdoob yay！ はい、お願いします

みなさん、こんにちは。＃20014をObject.definePropertyで更新し、 AnimationClipのサブクラス化も修正しました。 誰かがそれをレビューする時間があれば、私は余分な👀🙇🙇をいただければ幸いです

わかった。 r120が出たので...誰かが物事が適切にツリーシェイクされていることを確認できますか？

それは私にとってはちょっとうまくいくようですが、わずかです。
webpackのバンドルファイルにArrowHelperが表示されなくなりました。 しかし、多くの不要なコードはまだ存在しています😢

バンドルサイズはどうですか？ 前後

みなさん、アイデアがあり、 shakediffというツールをスパイクしました。 次のように実行できます。

$ shakediff builds/three.module.js Color

これにより、 Colorをインポートする小さなモジュールが生成され、3つにバンドルされてから、ロールアップのメタデータから3つの差分が作成されます。 詳細な差分を操作するか、 diffstatにパイプして、高レベルを取得できます。

$ shakediff build/three.module.js Color | diffstat 
 three.module.js | 2878 --------------------------------------------------------
 1 file changed, 1 insertion(+), 2877 deletions(-)

現在、パッケージはありませんが、試してみたい場合は、私のリポジトリからインストールできます。 フィードバックをいただければ幸いです。 ✌️

npm -g i ianpurvis/shakediff.git

ねえ@ mrdoob 、examplesフォルダ内のスクリプトをどのように処理するかを明確にしていただけますか？
＃19989を直接変換するのが好きですが、そうすることで、utils /modularize.jsをexamples / jsフォルダーでその作業を上書きせずに使用できなくなったことに気付きました。 これは、examples / jsを維持する私たちの終わりと、examples / jsmだけの始まりを示していますか？

この@mrdoobの評決は何ですか？ 例をES6クラスに変換できるように、jsmを信頼できる情報源にすることは理にかなっていますか？ おそらく、utils / demodularize.jsを作成して、他の方向への変換をサポートできますか？

examples/jsフォルダーは2020年12月に削除されます。それまでは、フォルダーの内容（またはその内容から生成されたexamples/jsmファイル）をES6クラスにアップグレードせずに、フォルダーをそのままにしておく必要があります。 その日付以降、 examples/jsmファイルが真実のソースになり、ES6クラスに更新できます。

モジュールスコープ変数がシェイク中に削除されていないことに気づきました。 これらの4つの変数、 build/three.module.js:43059での動作を確認できます。

const _position$3 = new Vector3();
const _quaternion$4 = new Quaternion();
const _scale$2 = new Vector3();
const _orientation$1 = new Vector3();

特別なコメントでこれらを純粋にマークする必要があるようです-

const _position = /*@__PURE__*/ new Vector3();

それは誰にとってもうまくいきますか？

私にはいいですね👌

いいですね、 Colorでツリーが揺れると、さらに144行が削除されます🥳

時間があるときに、誰もがあなたのオープンPRに/*@__PURE__*/の扱いをしてください！

@ianpurvis素晴らしい！ ロールアップを使用していますか？ 設定を共有できますか？

@mrdoob私はついにいくつかのテストをするために回りました。 私は個人的にwebpackを使用しているので、それを使っていくつかのテストを行いました。誰かが興味を持っている場合、私の設定はこれです。

このコードをテストしました

import * as THREE from 'three'

console.log(THREE.WebGLRenderer)

0.119.1

0.120.1

だから何かが木に揺れている、素晴らしい！

さらに詳しく調べてみると、クラスAudioListenerがバンドルに含まれていないようです。すばらしいニュースです。

Webpackは、@ ianpurvisによって指摘された未使用の変数も自動的に削除します。

この後、クラス外で定義された静的メソッドをテストすることにしました

残念ながら、これによりクラスはツリーシェイクできなくなります

さらに掘り下げてみると、どこにも使用されていないDodecahedronGeometryのようなジオメトリクラスがまだバンドルに含まれていることに気付きました。

後で私が発見したのは、これはthree.module.jsバンドル内のこのGeometriesオブジェクトが原因でした

これは、ObjectLoaderでこのようなパターンを使用すると自動的に生成されます。 ObjectLoaderをクラスにすると、これはおそらくなくなり、 src/geometriesはツリーシェイク可能になります。

@marcofugaro https://github.com/mrdoob/three.js/pull/20239

@marcofugaro問題ありません、これがロールアップ設定です

@marcofugaroこんにちは、shakediffにwebpackのサポートを追加しました...このwebpackの設定は問題ないようですか？ terserは、webpackのツリーシェイクでデッドコードを除去する責任があるため、これらの出力での変換アーティファクトを防ぐことは困難です。 ただし、空白を無効にしてヒストグラムアルゴリズムを使用して差分をとる場合は、管理できます。 今夜の簡単なテストから、webpackは/*@__PURE__*/と/*#__PURE__*/の両方を受け入れるようです。 どちらか一方を標準化できると思います。 もっと明日...

@ianpurvis自分のマシンにshakediffをインストールすることは許可されていないと思います...

とにかく、私は簡単なテストをしました：

import { WebGLRenderer } from './src/renderers/WebGLRenderer.js';
console.log( new WebGLRenderer() );

そして、 Geometryがツリーシェイクされていないことに気づきました。 https://github.com/mrdoob/three.js/pull/20394で修正されています。

次に、次のことを試してみました。

import { Vector3 } from './src/math/Vector3.js';
console.log( new Vector3() );

そして、ロールアップが未使用のメソッドをツリーシェイクしないことに気づきました...😕

@mrdoob残念ながら、近い将来、クラスメソッドがどのツールでもツリーシェイク可能になることはありません。 一体、それらは縮小することさえできません！

これは、JavaScriptでは、オブジェクトのプロパティに動的にアクセスできるのと同じように、 this['I am a string']などのメソッドにアクセスできるためです。 このため、ツールは、メソッドを呼び出すかどうか、およびどのように呼び出すかを事前に認識していません（ this[variable]の可能性があります）。

これは、ES6クラスと関数クラスの両方で同じです。 たとえば、 three.min.jsでは、他のオブジェクトプロパティと同じように、メソッドは変更されません🙂

そして、 this['I am a string']のようなメソッドを呼び出さないことが期待されるビルダーの「厳密な」モードを提案した人は誰もいません。

わからない🤷‍♂️

ロールアップに関するこのトピックに関するディスカッションは次のとおりです： https ：//github.com/rollup/rollup/issues/349

クラスメソッドは、どのツールでもツリーシェイク可能になることはありません。 一体、それらは縮小することさえできません！

トピックから外れて申し訳ありませんが、「パブリック」と「プライベート」の違いについてコンパイラーにヒントを与えると、ミニファイが機能するようになります。 過去に、私はこのためのメソッドに「_」プレフィックスを使用しました。 https://github.com/developit/microbundle/wiki/mangle.jsonを参照してください。 しかし、残念ながら、私はまた、ツリーシェイクに同様のことが可能かどうかもわかりません。 😕

うわー！ ＃20395が統合されました！ 良いもの@marcofugaro

バベルと幾何学についての素晴らしいニュース！

@ianpurvis自分のマシンにshakediffをインストールすることは許可されていないと思います...

@mrdoobうーん、Parcelはそのバージョンのfseventsに依存しているようです...多分私はそれをもっと高いものに固定することができます。

Fyi、Webpack5でのツリーシェイクの改善に関する良い情報...

Fyi、Webpack5でのツリーシェイクの改善に関する良い情報...

進捗状況... Rollupがこれも実装することを願っています...

こんにちは、みんな、

.is**Classname**プロパティとthis.type = **Classname**の目標は正確には何ですか？
それは古い疑似クラスパターンの残りではありませんか？
なぜそれを完全に取り除き、この使用法を通常の型チェック方法に置き換えないのですか？

obj instanceof Vector3  // prefer this one for inheritance
// or
obj.constructor === Vector3  // prefer this for no inheritance

つまり、ESクラスへの移行の一環として、オブジェクトにはすでにチェック可能な正しい型があります...

ライブラリは以前obj instanceof Vector3を使用していました。
しかし、Rich Harrisは、すべてのチェックを実装してis*に変更し、ツリーの揺れを可能にしました：＃9310

ライブラリは以前obj instanceof Vector3を使用していました。
しかし、Rich Harrisは、すべてのチェックを実装してis*に変更し、ツリーの揺れを可能にしました：＃9310

答えてくれてありがとう、私はスレッドを読みました、ところで、他のクラスがそれをタイプチェックする必要がある場合、なぜクラスが出力に含まれるのを避けなければならないのかわかりません...つまり、バンドルされたクラスXが必要な場合オブジェクトがクラスBであることを認識するために、クラスBが使用され（少なくとも上記のオブジェクトを何らかの方法で作成するために）、バンドルする必要がありますね。

たとえば、WebGLRendererは、レンダリングするジオメトリがBufferGeometryであるかGeometryであるかを確認する必要がありますが、Geometryインスタンスを作成することはありません。 ほとんどのthree.jsアプリケーションはBufferGeometryのみを使用する必要があるため、ツリーシェイクを使用して、可能な場合はバンドルからGeometry（およびそのサブクラス）を削除する必要があります。

視覚的に...

このパターンにより、バンドル時にWebGLRendererに常にGeometryが含まれるようになります。

import { Geometry } from '../core/Geometry.js';
import { BufferGeometry } from '../core/BufferGeometry.js';

if ( geometry instanceof Geometry ) {
} else if ( geometry instanceof BufferGeometry ) {
}

このパターンは次のことを行いません。

if ( geometry.isGeometry === true ) {
} else if ( geometry.isBufferGeometry === true ) {
}

やあみんな、

これを踏まえて、ここから前進することについての私たちの考えは何ですか？

まだ変化はないと思います。 （1） examples/jsに含まれておらず、（2） examples/jsに含まれていないものはすべて、ES6クラスに変換できます。 そのプロセスが終了している場合は、 examples/jsをクラスに切り替えるタイミングを決定する必要があります。

記憶から、そして簡単に調べた後、私たちはかなりのことをしました、そしてまだいくつかのPRが待っている準備ができています。

依存関係/例の拡張リストを再コンパイルしてみてください。

@DefinitelyMaybeねえ！ それは素晴らしいですね、あなたのリストはとても役に立ちました。 そして、 @ donmccurdyの戦略は私には理にかなっています。 👍私たちがすでに行った作業を閉鎖するのが最善だと思います。 ＃20070は、プライベート/非表示の変数をES6に移行するための戦略を提供できるため、攻撃するのに最適なPRになります（ renderers/webglをES6に移行するためにこれが必要です）。 誰もがそこでの議論にベンチマークやチャイムを実行することができれば、私はそれをいただければ幸いです。 私たちはいくつかのまともなオプションがあると思います、ただパフォーマンスが良いことを確認する必要があります。

わかった、
ESクラスへの書き直しの例のためにいくつかのPRを始めるかもしれません...
@mrdoobは、jsmからjsへのスクリプトを実行するのに問題がありますか？ （私はそうは思いませんが、あなたが私たちにそれを待つことを好むかどうか教えてください）

サンプルコードをクラスに変換する前に、＃20527、＃20529、または別のソリューションを最初にマージする必要があります。 https://github.com/mrdoob/three.js/issues/19986#issuecomment-718308451に記載されている条件を満たすコードを除きます。

@DefinitelyMaybeあなたは最初のコメントで言った：

• クラスフィールドを使用する

1）すべてにクラスフィールドを使用できるということですか？
そのようです ：

class Light extends Object3D {

    type = 'Light';
    isLight = true;

    color = new Color;
    intensity = 1;

    constructor(color, intensity = 1) {

        super();

        this.color = new Color(color);
        this.intensity = intensity;

    }

    copy() {
        ...
    }
}

...または.is*プロパティのみですか？

では、2）空のコンストラクターはどうですか？ ES2015の仕様によると、 super()呼び出しのみのコンストラクターは、提供されていない場合は暗黙的であるため、一部の子クラスは実際に簡単に定義できます。

class MapControls extends OrbitControls {

    screenSpacePanning = false; // pan orthogonal to world-space direction camera.up

    mouseButtons = { LEFT: MOUSE.PAN, MIDDLE: MOUSE.DOLLY, RIGHT: MOUSE.ROTATE };

    touches = { ONE: TOUCH.PAN, TWO: TOUCH.DOLLY_ROTATE };

}

そして3）プライベートクラスフィールドはどうですか？

class OrbitControls extends EventDispatcher {
    ...

    #offset = new Vector3();

    // so camera.up is the orbit axis
    #quat = new Quaternion().setFromUnitVectors( object.up, new Vector3( 0, 1, 0 ) ); <= this will go in constructor because of object.up
    #quatInverse = this.#quat.clone().inverse();

    #lastPosition = new Vector3();
    #lastQuaternion = new Quaternion();

    #twoPI = 2 * Math.PI;

    update() {
        ... ( no more closure and return function here )
    }

}

最新のChromeは、パブリッククラスフィールドとプライベートクラスフィールドの両方をネイティブにサポートしています...

20395

最初の鍵は、すべてのテストに合格することです。

変更を少なくすることで、最初は問題が少なくなります。

@marcofugaroクラスフィールドに変更できる変数がまだいくつかあると思いますよね？
私は次のようなものを見ています：

class EdgesGeometry extends BufferGeometry {

    constructor( geometry, thresholdAngle ) {

        super();

        this.type = 'EdgesGeometry';

に変更されました：

class EdgesGeometry extends BufferGeometry {

    type = 'EdgesGeometry';

    constructor( geometry, thresholdAngle ) {

        super();

私が「 new this.contructor() != new Foo() 」に遭遇した方法のように、その場所の周りで他のいくつかの警告に遭遇する可能性があります。

プライベートクラスフィールド

これは進行中の議論です。 使用する場合はしばらく時間がかかります。 私はあなたに向けることができる問題やPRがわかりません。

@marcofugaroクラスフィールドに変更できる変数がまだいくつかあると思いますよね？
私は次のようなものを見ています：

ええ、それは今できることです。 ただし、 .is*プロパティは、 Object.defineProperty(this, ...を使用する必要があるため、列挙および書き込み不可である必要があるため、これを行うことはできません。

どのように再度チェックされますか？ Object.defineProperty(this, ... staticキーワードを使用することは可能でしょうか？

どのように再度チェックされますか？ Object.defineProperty(this, ... staticキーワードを使用することは可能でしょうか？

obj.is*はクラス自体ではなく、インスタンス上にある必要があるため、私はそうは思いません...

現在の設定でbabelが正確にトランスパイルするのかどうかはわかりませんが、デコレータを使用してクラスフィールドを列挙不可/書き込み不可として設定できます。

import { unwrittable, unenumerable } from 'some/decorator/helpers.js'

class Foo {
    @unwrittable<strong i="12">@unenumerable</strong>
    isFoo = true;
}

@DefinitelyMaybe staticプロパティは異なり、クラス自体からではなく、インスタンスからアクセスできません。

class Test {
  static staticProp = true

  constructor() {
    Object.defineProperty(this, 'definedProp', { value: true })
  }
}
const test = new Test()

console.log(test.staticProp, test.definedProp)

結果：

undefined true

私の主なポイントは、このプロパティをチェックするコードを調整すると、次のようになる可能性があるということです。

class Test {
  constructor() {
    Object.defineProperty(this, 'definedProp', { value: true })
  }
}

に

class Test {
  static definedProp = true
  constructor() {
  }
}

それで、このチェックがどこで、なぜ行われるのか、そしてそれを変更できるかどうか疑問に思いました。

@DefinitelyMaybe問題は、インスタンスタイプの情報を取得することです。 では、インスタンスのクラスにアクセスして静的プロップを取得できるのであれば、なぜ静的プロップを使用するのでしょうか。 あなたはすでにクラスの名前を持っています...

obj.constructor.isFoo == true
obj.constructor.name == 'Foo'

編集：これを書くと、単一の最終クラス名だけと比較して、いくつかの.is *を持つことが最終的に各継承チェーンでテストするのに役立つことがわかりました...

obj.constructor.isFoo || obj.constructor.isBar || obj.constructor.isBaz

Edit2：はい、クラス名でも同じことができますが、テストはもっと複雑です...

let types = getInheritanceNames(obj) // looping each .constructor.prototype.constructor.name
types.contains( 'Foo' ) || types.contains( 'Bar' ) || types.contains( 'Baz' ) 

インスタンスから

おっとっと。 それを読み直してください。 うん、私が言っていたことを気にしないでください。

if ( scope.object.isPerspectiveCamera ) {
...
}

if ( geometry.isBufferGeometry ) {
...
}

if ( material.isShaderMaterial ) {
...
}

正しい。 2つのこと。

• 何が残っていますか？

examples/jsをクラスに切り替えるタイミングを決定する必要があります。

• 進歩するためにこれを議論する必要性に近づいています。

＃20527と＃20529のどちらを待つべきかわかりません。どちらも、現在の形式でexamples/jsを再作成しようとしているためですが、これは私たちが目指している場所ではありません。 私の最初の提案は、 examples/jsをそのまま変換し始めることです。 問題は、私たちがどんな問題を抱えているのかということです...

また、 @ mrdoobが最近言ったことを繰り返したいと思いました

最初の立方体をレンダリングするために、初心者にポリフィルやバンドラーについて学ぶように強制するのは嫌です。

しばらくの間モジュールを使用してきた人として、ワークフローは明確であり、何かを機能させるために必要なさまざまな概念を理解しています。 バンドラーやポリフィルは必要ありませんが、Three.jsの最初の記述方法を調整する必要があります。

また、おそらくREPLを追加することで、Three.jsを対象としたものがこの分野で役立つ可能性がありますか？ svelteの例

また、次のようなクラス以外のパターンを置き換える方法を明確にする必要があります。

function Foo() {

    this.update = function () {

        var priv = 'foo'

        return function update() {
            ...
        };

    }();

}

私見では、プライベートクラスフィールドを使用して、ロールアップ/バベルを古いパターンにトランスパイルさせて、特定の古いブラウザがこれをネイティブに実装していないようにすることができます...

私見では、プライベートクラスフィールドを使用して、ロールアップ/バベルを古いパターンにトランスパイルさせて、特定の古いブラウザがこれをネイティブに実装していないようにすることができます...

私はこの戦略に同意しますが、もちろん決定は、そのコードを維持する必要があるコアメンテナーに依存します。

いいね。 これを最初にsrc内で披露することをお勧めします。つまり、 @ devingfxがsrc内で記述したものと同様に奇妙なパターンを見つけ、代わりにプライベート変数を使用するPRを作成し、babelが何をするかを示します。それと。

どのスクリプトに関する提案はありますか？

検索： internal 、 private 、 readonly 👀

待ってください、すべての_*変数はプライベートであることが意図されていましたか？

..。

この部屋の象はsrc/renderers/WebGLRenderer.jsかもしれません

WebGLAnimationはどうですか、それは素敵な小さなクラスです... https://github.com/mrdoob/three.js/pull/20070

どのスクリプトに関する提案はありますか？

私はexemples/jsに焦点を合わせており、OrbitControlsでこれを見つけました...

バベルがそれで何をするかを示してください。

mrDoobの構文思考に一致するものは出力されないと確信しています😅

右に。

とおっと。 私の頭脳はどこにありますか... examplesフォルダーの変換を開始するには、＃20527または＃20529（またはその他）のいずれかをマージする必要があります。 examples/jsは当面の間、固執しています。つまり、 examples/jsフォルダーをクラスでタッチすることは絶対にありません。 それはIEとの互換性を壊すでしょう...ため息をつきます。

ロールアップ/バベルを古いパターンにトランスパイルする

それらのJSMからJSPRまでの考え方を推測し、サポートします。 決定が下されたら、 examples/jsmを狙うことができます。

srcにプライベート変数を追加することは、「これらの変数は特定の目的を持っているので、遊んではいけない」という長年の問題に対する良い解決策になるため、依然として良い考えです。

examples/jsフォルダーにクラスで触れることは、絶対にありません。

おっと、私の悪い、私はもちろんexemples/jsmを掘り下げることについて話していました、 exemples/jsは近い将来「構築された」バージョンになるでしょう...

それはIEとの互換性を壊すでしょう...ため息をつきます。

何？？？ 2020年のInternetExplorerについてはまだ話し合っていますか？ この7歳の恐竜でのWebGLライブラリの互換性について話しているのですか？ 真剣に ！！ 1.4％ ..。
_（3人のユーザーがIEでの使用を計画している場合は、収集する統計コレクターをライブラリに追加する必要があります）_

😞ところで、それがバベルが存在する理由です...

ビルドファイルthree.jsとthree.min.js 、およびexamples/js内のすべてのファイルは、IE11などの古いブラウザーを引き続きサポートする必要があります。

昨年、IE 11（＃18091）のサポートを停止するPRがありましたが、このブラウザーに依存しているユーザーがまだいることが判明しました。 また、プロジェクトの現在のポリシーは、ユーザーがES6からES5への変換を自分で実行しないように、ユーザーにそれぞれのファイルを提供することです。 これは＃20455でも議論されました。

プロジェクトの現在のポリシーは、ユーザーがES6からES5への変換を自分で実行しないように、ユーザーにそれぞれのファイルを提供することです。

さて、ソースを最新の方法で開発でき、結果のビルドが読み取り可能ではなく、機能しているだけであれば、そのポリシーに問題はありません...
トランスパイラーはそのような醜いコードを出力するからです！
したがって、ESnextでsrcが書き込まれ、ビルドが醜い場合でも問題はありませんが、このファイルが読み取り可能で、コメントが付けられ、整形式である必要がある場合は、 exemples/jsに潜在的な問題があります...

ところで、私は何度か自分自身に、なぜいくつかの模範が模範であり、主要なコアソースではないのかを自問しています！？
例：コントロールは通常、そのまま使用され、オプションのアドオンのようにコピーされ、プロジェクトを作成するために読んだりインスピレーションを得たりする実際の例としては使用されません。たとえば、回転する立方体の例のように...

_（私は3つの検索で旅を始めました：「webgl回転キューブ」とその例は、プラットフォーム上を移動するキューブを使った小さなゲームを開発する1泊のコードマラソンにつながりました^^）_

適切なビルドを使用する場合、コアにあるファイルとexamplesディレクトリにあるファイルは関係ありません。 ツリーシェイクが適切に機能する限り、ビルドには実際に必要なソースファイルしかありません。

私にとって、コアと例の区別は、この種のワークフローがまだ利用できなかった時代に由来しています。 コアは完全に単一のコンポーネントとしてインポートする必要があるため、コアは小さくコンパクトである必要があります。 最も_重要な_ファイルのみを含める必要があります。 最終的にコアに含まれるファイルは、ある意味でケースバイケースの決定でした。

適切なビルドを使用する場合、コアにあるファイルとexamplesディレクトリにあるファイルは関係ありません。 ツリーシェイクが適切に機能する限り、ビルドには実際に必要なソースファイルしかありません。

これはESモジュールのユーザーにのみ当てはまります;）