Three.js: ES6 कक्षाओं का मूल्यांकन करें

तो आप इसके बजाय इस पैटर्न का उपयोग करने का सुझाव दे रहे हैं?

PointLight.prototype = Object.create( Light.prototype );
Object.assign( PointLight.prototype, {

class PointLight extends Light

हेहे 😄 और कोई समस्या नहीं ...

@sasha240100 किसी दिन...

@mrdoob बिल्कुल नहीं - आपके द्वारा उल्लिखित दो तरीके सीधे समकक्ष हैं। मुझे लगता है कि ओपी तुलना कर रहा है

PointLight.prototype = Object.assign( Object.create( Light.prototype ), { 
    constructor: PointLight,
    prop1: 'something',
    method1: function someFunction() { .. },
    ...
});

साथ

function PointLight () { ... };

PointLight.prototype = Object.create( Light.prototype );

PointLight.prototype.constructor = PointLight;

PointLight.prototype.prop1 = 'something';

PointLight.prototype.method1 = function someFunction() { .. };

...

उदाहरण के लिए यह यहाँ किस तरह से किया गया है।
जहाँ तक मैं देख सकता हूँ कि ये शैलियाँ समान हैं - क्या मुझे कुछ याद आ रहा है?
या एक बार उपलब्ध होने और कोडबेस में अपडेट नहीं होने के बाद शैली को Object.Assign का उपयोग करने के लिए बदल दिया गया था?

@looeee @ bfred-it @mrdoob सिर्फ rollup-babel का उपयोग क्यों नहीं कर रहे हैं?

तुलना :
वर्तमान। es5 + es6 सद्भाव मॉड्यूल।

import { LineBasicMaterial } from './LineBasicMaterial';
import { Color } from '../math/Color';

function LineDashedMaterial( parameters ) {

    LineBasicMaterial.call( this );

    this.type = 'LineDashedMaterial';

    this.scale = 1;
    this.dashSize = 3;
    this.gapSize = 1;

    this.setValues( parameters );

}

LineDashedMaterial.prototype = Object.create( LineBasicMaterial.prototype );
LineDashedMaterial.prototype.constructor = LineDashedMaterial;

LineDashedMaterial.prototype.isLineDashedMaterial = true;

LineDashedMaterial.prototype.copy = function ( source ) {

    LineBasicMaterial.prototype.copy.call( this, source );

    this.scale = source.scale;
    this.dashSize = source.dashSize;
    this.gapSize = source.gapSize;

    return this;

};


export { LineDashedMaterial };

ईएस2015+. समान कोड, लेकिन es2015+ साथ में babel-plugin-transform-class-properties :

import { LineBasicMaterial } from './LineBasicMaterial';
import { Color } from '../math/Color';

export class LineDashedMaterial extends LineBasicMaterial {
  type = 'LineDashedMaterial';

  scale = 1;
  dashSize = 3;
  gapSize = 1;
  isLineDashedMaterial = true;

  constructor(parameters) {
    super();
    this.setValues( parameters );
  }

  copy(source) {
    super.copy(source);

    this.scale = source.scale;
    this.dashSize = source.dashSize;
    this.gapSize = source.gapSize;

    return this;
  }
}

ES6 सुविधाएँ जो तीन.js कोड को सरल बनाती हैं:

• डिफ़ॉल्ट पैरामीटर मान।
  
  
  
  • कोड के ऐसे हिस्सों को आसानी से बदल सकता है
  
  
• संपत्ति आशुलिपि
  
  
  
  • यहां इस्तेमाल किया जा सकता है
  
  
• तीर समारोह
  
  
  
  • https://github.com/mrdoob/three.js/blob/dev/src/loaders/JSONLoader.js#L36
  
  

मैं ES2015+ पर जाने के लिए तैयार हूं, हमें बस उसी कोड को आउटपुट करने का एक तरीका खोजने की जरूरत है जो वर्तमान में हमारे पास है, इसलिए प्रदर्शन सभी मामलों में समान रहता है।

कक्षाओं के संदर्भ में मेरा एक प्रश्न है। हम वेक्टर3.अनप्रोजेक्ट जैसी विधियों को क्लास सिंटैक्स में कैसे स्थानांतरित करेंगे? एक नया दायरा बनाने के लिए विधि वास्तव में बंद करने का उपयोग करती है। यह एक महत्वपूर्ण तंत्र है जो वस्तु निर्माण की मात्रा को यथासंभव कम रखता है।

क्या हमें इन मामलों में Object.assign की आवश्यकता है?

@ Mugen87 @mrdoob es6 प्रदर्शन पर कुछ रोचक जानकारी। विशेष रूप से Object.assign पर:

इस लेख से

हम वेक्टर3.अनप्रोजेक्ट जैसी विधियों को क्लास सिंटैक्स में कैसे स्थानांतरित करेंगे? एक नया दायरा बनाने के लिए विधि वास्तव में बंद करने का उपयोग करती है।

@ Mugen87 क्या वे सिर्फ गैर-निर्यात मॉड्यूल स्कोप्ड ऑब्जेक्ट नहीं हो सकते हैं? कुछ इस तरह;

const tempMatrix = new Matrix();    

export default class Vector3{
    unproject() {
        // uses tempMatrix
    }
}

आह हाँ, मुझे लगता है कि यह काम करना चाहिए

पिछले महीने ट्विटर पर यह सुझाव दिया गया था :

https://astexplorer.net/#/gist/9db8b707e3f69f94ded4af737f879fa7/b12fb12806e97df96278ec8b7d52018c8421872f

@mrdoob वाह! ऐसा लगता है कि पहले से ही काम कर रहा है। क्या हम एक शाखा नहीं बना सकते हैं, कुछ वर्गों को es6 में बदल सकते हैं और देख सकते हैं कि यह कैसे संकलित होता है?

@ satori99 ग्लोबल्स के साथ समस्याओं से बचने के लिए tempMatrix को वेक्टर3 कोड के अंदर कैसे रखा जाए, इसके बारे में एक विचार के रूप में:

export default class Vector3 {
    static tempMatrix = new Matrix();

    unproject() {
        // uses Vector3.tempMatrix
    }
}

@mrdoob वाह! ऐसा लगता है कि पहले से ही काम कर रहा है। क्या हम एक शाखा नहीं बना सकते हैं, कुछ वर्गों को es6 में बदल सकते हैं और देख सकते हैं कि यह कैसे संकलित होता है?

मुझे अच्छा लगा! मैं वर्तमान में WebVR पर ध्यान केंद्रित कर रहा हूं, इसलिए इसे मेरे अलावा कोई और होना चाहिए।

@ sasha240100 मॉड्यूल स्कोप्ड वर्र्स का उपयोग करने का लाभ यह है कि वे नियमित उपयोगकर्ता कोड से छिपे रहते हैं, जो अस्थायी चर के लिए उपयुक्त लगता है।

मुझे निजी युद्धों के संबंध में "हम यहां सभी वयस्क हैं" पाइथोनिस्टिक दृष्टिकोण से कोई फर्क नहीं पड़ता, लेकिन अस्थायी चर वास्तव में नामस्थान को अनावश्यक रूप से प्रदूषित नहीं करना चाहिए।

साथ ही, यह अच्छा होगा यदि हममें से जिन्होंने अपने ब्राउज़र में मूल मॉड्यूल समर्थन सक्षम किया है, वे सीधे स्रोत फ़ाइलें लोड कर सकते हैं। प्रत्येक संपादन के बाद देखने वालों और ट्रांसपिलिंग की आवश्यकता के बिना विकसित करने का यह एक और अधिक सुखद तरीका है। वर्ग गुणों का उपयोग करने का अर्थ है कि यह संभव नहीं है क्योंकि वे वर्तमान वर्ग युक्ति का हिस्सा नहीं हैं।

बटिंग के लिए क्षमा याचना। हमें शायद इस मुद्दे के शीर्षक को कुछ इस तरह बदलना चाहिए - "ES6 कक्षाओं का मूल्यांकन करें", क्योंकि अब धागा कुछ पूरी तरह से अलग हो गया है।

पैटर्न क्यों बदलें @ Mugen87 @ satori99 ?

method =(()=>{ 
    const vec3forThisScope =...; 
    return (arg)=>{...}
})()

टाइपस्क्रिप्ट का प्रयास क्यों न करें, इसे js . के अन्य संस्करणों में संकलित किया जा सकता है

टाइपस्क्रिप्ट वास्तव में सोचने के लिए एक बढ़िया विकल्प होगा क्योंकि यह एक ट्रांसपिलर + टाइप चेकर और जावास्क्रिप्ट का एक सुपरसेट है, इसलिए कोड बेस को .ts फाइलों पर ले जाना आसान है और टाइप चेकिंग के साथ धीरे-धीरे ईएस 6 पर रिफैक्टर करना आसान है।

यह डरावना लग सकता है यदि आपने कभी टाइपस्क्रिप्ट का उपयोग नहीं किया है, लेकिन यह वास्तव में एक बड़ा सीखने की अवस्था नहीं है और इससे होने वाले लाभों के लिए भुगतान करने के लिए एक छोटी सी कीमत होगी। टाइपस्क्रिप्ट समुदाय इस संक्रमण में मदद करने और वर्तमान पुस्तकालय के खिलाफ प्रदर्शन परीक्षण बनाने में बहुत खुश होगा ताकि यह सुनिश्चित हो सके कि इसे डाउनग्रेड नहीं किया जा रहा है।

कुछ उपयोगी लेख:

• आपको टाइपस्क्रिप्ट से क्यों नहीं डरना चाहिए
• टाइपस्क्रिप्ट बनाम ES6 बनाम ES2015
• टाइपस्क्रिप्ट जीता
• टाइपस्क्रिप्ट क्या है और एंडर्स हेजल्सबर्ग के साथ क्यों?

कोर डेवलपर एंडर्स हेजल्सबर्ग के उद्धरण के लिए, टाइपस्क्रिप्ट का जन्म ग्राहकों और आंतरिक टीमों की शिकायतों के जवाब में हुआ था कि जावास्क्रिप्ट बड़े अनुप्रयोगों के लिए अच्छी तरह से उधार नहीं देता था।

लक्ष्य "जावास्क्रिप्ट को कक्षाओं, मॉड्यूल और स्थिर टाइपिंग जैसी चीजों के साथ मजबूत करना" था, इसके खुले मानकों और क्रॉस-प्लेटफ़ॉर्म होने के लाभ का त्याग किए बिना; परिणाम "एप्लिकेशन स्केल जावास्क्रिप्ट डेवलपमेंट के लिए भाषा" था, जिसे भाषा के सुपरसेट के रूप में बनाया गया था।

जब तक ब्राउज़र मूल रूप से टाइपस्क्रिप्ट निष्पादित नहीं कर सकते, मैं जावास्क्रिप्ट का उपयोग करना पसंद करता हूं।

@mrdoob

मैं यह नहीं देख सकता कि टाइपस्क्रिप्ट का पूरी तरह से उपयोग न करने के वैध कारण के रूप में इसे सीधे ब्राउज़र में नहीं चलाया जा सकता है। कोड की सभी अतिरिक्त पंक्तियों के कारण आप इसे ब्राउज़र में नहीं चलाना चाहेंगे जो केवल समय की जाँच के संकलन के लिए है। यह वर्तमान में रनटाइम जाँच भाषा नहीं है। इसलिए यदि इसे कभी भी ब्राउज़र में उपयोग किया जाता है तो यह संभावना से अधिक है कि सभी टाइप किए गए कोड को हटा दिया जाएगा क्योंकि यह प्रदर्शन को प्रभावित करता है और यह तब वैनिला जावास्क्रिप्ट कोड होगा।

मुझे लगता है कि आप एक टाइप की गई भाषा का उपयोग करने और बड़े कोड बेस में विकास में होने वाले लाभों को पूरी तरह से याद कर रहे हैं। आप अभी भी जावास्क्रिप्ट लिख रहे हैं और उपयोग कर रहे हैं, टाइपस्क्रिप्ट का पूरा बिंदु यह है कि यह जावास्क्रिप्ट का सुपरसेट है। आप जावास्क्रिप्ट को प्रकारों के साथ लिखते हैं, जो निर्दिष्ट ईसीएमएस्क्रिप्ट लक्ष्य संस्करण में जावास्क्रिप्ट में संकलित है, जो संकलक विकल्पों में कॉन्फ़िगर करने योग्य है, अनुमत मान 'es3', 'es5', 'es2015', 'es2016', 'es2017' या 'हैं। एसनेक्स्ट'।

क्योंकि टाइपस्क्रिप्ट जावास्क्रिप्ट है, यह सब कुछ एक साथ रिफैक्टर करने के बड़े सिरदर्द के बिना उत्तरोत्तर माइग्रेट करना संभव बनाता है। यह धीरे-धीरे किया जा सकता है और समुदाय द्वारा सुधार किया जा सकता है। ES6 कक्षाओं का उपयोग करने के लिए रिफैक्टरिंग के साथ यहां जो चर्चा की जा रही है, उससे अधिक काम नहीं है। यही कारण है कि मैं एक नया मुद्दा खोलने के बजाय यहां इसका उल्लेख करता हूं।

महान उदाहरणों के लिए नीचे टाइपस्क्रिप्ट खेल का मैदान लिंक देखें:

• क्लासिक जावास्क्रिप्ट उदाहरण
• उदाहरण जोड़ना
• त्रुटि उदाहरण के साथ प्रकार जोड़ना
• कक्षा उदाहरण का उपयोग करना
• त्रुटि उदाहरण के साथ कक्षाओं का उपयोग करना

@joejordanbrown

क्या आप किसी ऐसे व्यक्ति के बारे में सोच सकते हैं जो इस विशेष समस्या का सबसे अच्छा समाधान टाइपस्क्रिप्ट होने के बारे में आपसे असहमत हो सकता है?

यदि आप Google में typescript vs टाइप करते हैं, तो कुछ शब्द पॉप अप होते हैं, उनमें से एक फ़्लो होता है। इसके लिए खोज करने पर, कई लेख मिलते हैं जहां लोग इन दोनों के पेशेवरों और विपक्षों पर बहस कर रहे हैं।

इनमें से किसी एक को चुनने की तुलना में कोई भी प्रकार अधिक समझौता जैसा नहीं लगता।

उन परियोजनाओं के लिए टाइपस्क्रिप्ट सहेजें जो उनके द्वारा बनाए गए परिणाम से अधिक जटिल हैं - विशेष रूप से फ़्रंटएंड फ़्रेमवर्क जिन्हें पहले HTML में लागू किया जा सकता था। मेरा मूल बिंदु जावास्क्रिप्ट रोग से छुटकारा पाना था, न कि इसे और खराब करना। जावास्क्रिप्ट एक साधारण लगभग खिलौना भाषा है जिसे कभी-कभी तीन.जेएस जैसे जटिल परिणामों के लिए उपयोग किया जाता है। टाइपस्क्रिप्ट व्यर्थ है।

6 सितंबर, 2017 को दोपहर 1:55 बजे, जो नोटिफिकेशन @github.com ने लिखा:

@mrdoob

मैं यह नहीं देख सकता कि टाइपस्क्रिप्ट का पूरी तरह से उपयोग न करने के वैध कारण के रूप में इसे सीधे ब्राउज़र में नहीं चलाया जा सकता है। कोड की सभी अतिरिक्त पंक्तियों के कारण आप इसे ब्राउज़र में नहीं चलाना चाहेंगे जो केवल समय की जाँच के संकलन के लिए है। यह वर्तमान में रनटाइम जाँच भाषा नहीं है। इसलिए यदि इसे कभी भी ब्राउज़र में उपयोग किया जाता है तो यह संभावना से अधिक है कि सभी टाइप किए गए कोड को हटा दिया जाएगा क्योंकि यह प्रदर्शन को प्रभावित करता है और यह तब वैनिला जावास्क्रिप्ट कोड होगा।

मुझे लगता है कि आप एक टाइप की गई भाषा का उपयोग करने और बड़े कोड बेस में विकास में होने वाले लाभों को पूरी तरह से याद कर रहे हैं। आप अभी भी जावास्क्रिप्ट लिख रहे हैं और उपयोग कर रहे हैं, टाइपस्क्रिप्ट का पूरा बिंदु यह है कि यह जावास्क्रिप्ट का सुपरसेट है। आप जावास्क्रिप्ट को प्रकारों के साथ लिखते हैं, जो निर्दिष्ट ईसीएमएस्क्रिप्ट लक्ष्य संस्करण में जावास्क्रिप्ट में संकलित है, जो संकलक विकल्पों में कॉन्फ़िगर करने योग्य है, अनुमत मान 'es3', 'es5', 'es2015', 'es2016', 'es2017' या 'हैं। एसनेक्स्ट'।

क्योंकि टाइपस्क्रिप्ट जावास्क्रिप्ट है, यह सब कुछ एक साथ रिफैक्टर करने के बड़े सिरदर्द के बिना उत्तरोत्तर माइग्रेट करना संभव बनाता है। यह धीरे-धीरे किया जा सकता है और समुदाय द्वारा सुधार किया जा सकता है। ES6 कक्षाओं का उपयोग करने के लिए रिफैक्टरिंग के साथ यहां जो चर्चा की जा रही है, उससे अधिक काम नहीं है। यही कारण है कि मैं एक नया मुद्दा खोलने के बजाय यहां इसका उल्लेख करता हूं।

उदाहरण के लिए टाइपस्क्रिप्ट खेल का मैदान लिंक देखें:

क्लासिक जावास्क्रिप्ट उदाहरण
उदाहरण जोड़ना
त्रुटि उदाहरण के साथ प्रकार जोड़ना
कक्षा उदाहरण का उपयोग करना
त्रुटि उदाहरण के साथ कक्षाओं का उपयोग करना
-
आप इसे प्राप्त कर रहे हैं क्योंकि आपने सूत्र को लिखा है।
इस ईमेल का सीधे उत्तर दें, इसे GitHub पर देखें, या थ्रेड को म्यूट करें।

^ मैं राक्षसी पैटर्न के साथ भी ठीक रहूंगा, जब तक कि यह सुसंगत है।

@joejordanbrown लगता है जैसे आप टाइपस्क्रिप्ट से प्यार करते हैं। परियोजना को फोर्क करने के लिए स्वतंत्र महसूस करें और इसे टाइपस्क्रिप्ट पर पोर्ट करें। थ्री.टीएस! मैं

@ पेलहेड

यह पसंद की बात है, मुझे यकीन है कि कई सहमत और असहमत होंगे, यह सामान्य है हालांकि सही है! आप हमेशा "यह बनाम वह", "मेरा तुमसे बेहतर है" देखने जा रहे हैं। मैं समझता हूं कि प्रत्येक के अपने फायदे हैं। यह उपलब्ध विकल्पों को तौलने और यह देखने के बारे में है कि क्या वे परियोजना को लाभ पहुंचा सकते हैं। तुलना करना अच्छी बात है, यह परियोजनाओं को और आगे बढ़ाता है।

आप फ्लो का जिक्र करते हैं, जो समस्याएं मुझे दिखाई देती हैं वे हैं:

• फ्लो लाइसेंसिंग बीएसडी 3-क्लॉज " फेसबुक बीएसडी + पेटेंट लाइसेंस " है, अपाचे सॉफ्टवेयर फाउंडेशन ने नई परियोजनाओं में इस लाइसेंस के उपयोग पर प्रतिबंध लगा दिया है। आप यहां अधिक विवरण पढ़ सकते हैं।

• टाइपस्क्रिप्ट की तुलना में आईडीई समर्थन की कमी है।

• टाइपस्क्रिप्ट की तुलना में उपयोगकर्ता आधार छोटा है,

• सार्वजनिक पुस्तकालयों के लिए उपलब्ध टंकण अपूर्ण हैं, टाइपस्क्रिप्ट में बहुत अच्छी तरह से अनुरक्षित टंकण हैं।

• दस्तावेज़ीकरण और संसाधन खोजना मुश्किल है और टाइपस्क्रिप्ट की तुलना में अस्पष्ट हैं आपको बेहतरीन दस्तावेज़, किताबें, वीडियो और बहुत से अन्य ई-लर्निंग संसाधन मिलेंगे।

• फ़्लो .js फ़ाइलों का उपयोग करता है जिन्हें // @flow के साथ फ़्लैग किया गया है, यह भ्रमित करने वाला हो सकता है क्योंकि आप .js एक्सटेंशन देखते हैं इसलिए जावास्क्रिप्ट की अपेक्षा करें लेकिन वास्तव में, यह फ़्लो टाइप है। जहां टाइपस्क्रिप्ट अपने स्वयं के एक्सटेंशन का उपयोग करता है .ts । यह आपको एक ही निर्देशिका में समान नामों के साथ टाइपस्क्रिप्ट और जावास्क्रिप्ट आउटपुट फ़ाइलों को रखने की अनुमति देता है, जो एक छोटी परियोजना के लिए आदर्श है, जाहिर है, यह एक बड़ी परियोजना पर मामला नहीं होगा, हालांकि आप एक बिल्ड का उपयोग कर रहे होंगे निर्माण प्रक्रिया का प्रबंधन करने के लिए प्रणाली।

यहां तक ​​कि गूगल भी टाइपस्क्रिप्ट का बड़े पैमाने पर समर्थन कर रहा है, जो टाइपस्क्रिप्ट में उनके आत्मविश्वास को दर्शाता है। पोस्ट यहाँ या यहाँ पढ़ें।

मार्च 2017 तक अप्रतिबंधित क्लाइंट विकास के लिए टाइपस्क्रिप्ट की अनुमति हो गई है। टाइपस्क्रिप्ट पर टाइपस्क्रिप्ट और एंगुलर का उपयोग Google Analytics, फायरबेस और Google क्लाउड प्लेटफ़ॉर्म और महत्वपूर्ण आंतरिक टूल जैसे बग ट्रैकिंग, कर्मचारी समीक्षा और उत्पाद अनुमोदन और लॉन्च टूल में किया जाता है।

मैंने अभी सोचा था कि मैं एक टाइप की गई भाषा का उपयोग करने के बारे में चर्चा खोलूंगा और देखूंगा कि हर कोई इस विचार के बारे में क्या सोचता है। ऐसा लगता है कि @mrdoob इस विचार पर चर्चा करने के बिल्कुल खिलाफ हैं।

@arctwelve
मैं यह नहीं देखता कि यह परियोजना कैसे जटिल नहीं है और टाइप की गई भाषा का उपयोग करने से यह कैसे नकारात्मक रूप से प्रभावित होगी।

@mrdoob
बिल्कुल नहीं, मैं केवल उन लाभों को देख सकता हूं जो विशेष रूप से ES6 कक्षाओं में अद्यतन करने के लिए एक नई शाखा बनाई जा रही हैं। मुझे लगता है कि तीन.टीएस नामक अपना खुद का कांटा बनाने के साथ जवाब देना मूर्खतापूर्ण है। यह वास्तव में अच्छे ओएसएस प्रथाओं के खिलाफ है यदि हर कोई सिर्फ ओएसएस परियोजनाओं को फोर्क करता है और 1 परियोजना पर ध्यान केंद्रित करने और इसे सबसे अच्छा बनाने के बजाय अपने स्वयं के स्रोत कोड को संशोधित करता है। आप वास्तव में खराब सॉफ़्टवेयर या समुदायों के विभाजन के साथ समाप्त हो जाएंगे और किसी भी कारण से वे जिस परियोजना को पसंद करते हैं उस पर ध्यान केंद्रित करेंगे। आप पेशेवरों और विपक्षों के बारे में खुली चर्चा क्यों नहीं कर सकते?

डेविल्स एडवोकेट की भूमिका निभाने के लिए नहीं, लेकिन ऐसा लगता है जैसे उसने किया था

खुली चर्चा करें

यह वास्तव में छोटा था :)

मैं एक समान दृष्टिकोण साझा करता हूं, यह एक जेएस लाइब्रेरी है और जेएस मानकीकृत है। आप JS लाइब्रेरी के लिए JS चुनने में गलत नहीं हो सकते, जबकि यदि आप कुछ और चुनते हैं तो आप कर सकते हैं। मैंने फ्लो को टाइपस्क्रिप्ट के विकल्पों में से एक के रूप में लिया, अगर अन्य हैं तो पता नहीं।

वैसे भी, ऐसा लगता है कि हम वास्तव में विषय से हट गए हैं।

Mugen87 ने से शीर्षक बदल दिया
ES6 वर्गों का मूल्यांकन करने के लिए JavaScript रोग निकालें

मूल शीर्षक (जहाँ तक मैं समझता हूँ) शैली की एकरूपता की कमी को संदर्भित करता है। विशेष रूप से कुछ स्थानों में Object.assign() का उपयोग करना, और अन्य में एक अन्य पैटर्न का उपयोग करना।
अगर मैं यहां कुछ भी मूल्यांकन करता हूं, तो यह इस मुद्दे का वर्तमान शीर्षक होगा। एक नई भाषा का उपयोग करने के बारे में चर्चा में निरंतरता का मुद्दा क्यों उठाया जा रहा है?

मुझे लगता है कि टाइपस्क्रिप्ट और es6 दोनों के साथ, कोड काफी सुसंगत होना चाहिए।

मैं इस पृष्ठ को अपडेट करके इस समस्या का समाधान करूंगा:

https://github.com/mrdoob/three.js/wiki/Mr.doob 's-Code-Style%E2%84%A2

और या तो जोड़ना:

ए) "... ऑब्जेक्ट का उपयोग करें। असाइन करें ..."
बी) "... ऑब्जेक्ट का उपयोग न करें। असाइन करें"

पूरे पुस्तकालय में एक शैली। इसे बदलने की जरूरत नहीं है।

वफादार दो पंक्ति शैली अभी भी, उदाहरण के लिए, सामग्री वर्ग बहुत स्पष्ट और क्लीनर हैं।

यह पहली पोस्ट में है।

मैं सुझाव देता हूँ:

1. इस वाक्य को प्रतिबिंबित करने के लिए शीर्षक संपादित करें, पुस्तकालय में एक शैली रखने पर चर्चा करें, शैली मार्गदर्शिका संपादित करें आदि।
2. "ES6 कक्षाओं का मूल्यांकन करें" शीर्षक से एक नई चर्चा शुरू करें, जहां es6 कक्षाओं का मूल्यांकन किया जाएगा
3. "एक टाइप की गई भाषा में तीन लिखित होने का मूल्यांकन करें" शीर्षक से एक नई चर्चा शुरू करें, जहां टाइपस्क्रिप्ट और इस तरह की चर्चा की जाएगी

वैसे भी, ऐसा लगता है कि हम वास्तव में विषय से हट गए हैं।

वास्तव में। @joejordanbrown टाइपस्क्रिप्ट पर चर्चा करने के लिए एक नया विषय बनाने के लिए स्वतंत्र महसूस करें।

बीटीडब्ल्यू, पिछली बातचीत को नज़रअंदाज़ करना ओएसएस अभ्यास भी खराब है... https://github.com/mrdoob/three.js/issues/341#issuecomment -47000692

विषय पर वापस। मुझे लगा कि हमने पहले ही इस मुद्दे को सुलझा लिया है?

https://github.com/mrdoob/three.js/issues/11552#issuecomment -319449068

हमें बस इसे आजमाने के लिए किसी की जरूरत है।

ठीक है... सबसे पहले

पहला पैटर्न (सर्वश्रेष्ठ आईएमओ):

function MyClass() {...}

MyClass.prototype = Object.assign( Object.create( MyClassToInherit.prototype ), {

    constructor: MyClass,

    prop1: 'something',

    method1: function someFunction() { .. },

    ...

});

दूसरा पैटर्न:

function MyClass() {...}

MyClass.prototype = Object.create( MyClassToInherit.prototype );

MyClass.prototype.constructor = PointLight;

MyClass.prototype.prop1 = 'something';

MyClass.prototype.method1 = function someFunction() { .. };

...

@arctwelve यह पैटर्न कई कारणों से पेश किया गया था। यह हस्तमैथुन नहीं है!

सबसे पहले यह वस्तु विरासत के बारे में स्पष्ट पढ़ने की अनुमति देता है। वस्तु विरासत के बारे में Object.assign स्पष्ट रूप से यहां है। फिर आप विरासत में मिली वस्तु को MyClass.prototype की कई और कई पंक्तियों में नहीं खो सकते हैं।
दूसरा, एकाधिक वंशानुक्रम के मामले में, यह भी बहुत स्पष्ट है।
तीसरा, वर्ग का निर्माता पठनीय है और पहले बिंदु की तरह कई पंक्तियों में नहीं खोता है।
चौथा, यह एक ही स्थान (ब्रैकेट के अंदर) में गुणों और विधियों को समूहित करने की अनुमति देता है जो आपके पास एक ही फ़ाइल में 3, 4, 5 ... आदि कक्षाएं होने पर बहुत स्पष्ट है।
पांचवां, यह पैटर्न कुछ "विरासत में मिली" संपत्तियों के लिए सही प्रतिलिपि की जांच करने की अनुमति देता है।

अंत में ( @looeee ), यह प्रदर्शन के लिए भी है। प्रोटोटाइप के लिए एकाधिक और एकाधिक कॉल के बजाय फ़ाइल पार्सिंग होने पर पहला संस्करण अधिक अनुकूलित होता है।

वैसे भी !

आजकल, हमें ES6 सिंटैक्स पास करना चाहिए!

@mrdoob

मुझे अच्छा लगा! मैं वर्तमान में WebVR पर ध्यान केंद्रित कर रहा हूं, इसलिए इसे मेरे अलावा कोई और होना चाहिए।
हमें बस इसे आजमाने के लिए किसी की जरूरत है।

क्या आप एक es6 शाखा बनाएंगे? या यह हमारे दम पर है?

प्रोटोटाइप के लिए एकाधिक और एकाधिक कॉल के बजाय फ़ाइल पार्सिंग होने पर पहला संस्करण अधिक अनुकूलित होता है।

क्या अापको उस बारे में पूर्ण विशवास है? मुझे उम्मीद है कि Object.Assign धीमा होगा, अगर कुछ भी। लेकिन किसी भी मामले में मुझे संदेह है कि यह चिंता करने के लिए पर्याप्त प्रदर्शन ओवरहेड है।

बिल्कुल: https://jsperf.com/inline-prototype-vs-assign-prototype/1

क्रोम संस्करण 61.0.3163.100 के तहत (बिल्ड ऑफिसियल) (64 बिट्स) असाइन किए गए प्रोटोटाइप लगभग 60% तेज हैं

दिलचस्प। परीक्षण करने के लिए धन्यवाद।

हालांकि यह परिणाम सभी ब्राउज़रों के लिए सही नहीं है। फ़ायरफ़ॉक्स पर वे लगभग समान हैं ( Object.Assign ~3% तेज), जबकि एज पर Object.Assign ~33% धीमा है।

लेकिन किसी भी मामले में मुझे अभी भी नहीं लगता कि यह एक तर्क के रूप में प्रासंगिक है जिसके लिए शैली बेहतर है - यहां तक ​​​​कि सबसे धीमी समग्र (क्रोम में इनलाइन प्रोटो) अभी भी एक सेकंड में> 180,000 संचालन पर चल रही है, और शायद कुछ हजार हैं कोड में किए गए ये सेटअप। तो हम यहां शायद कुछ मिलीसेकंड के अंतर के बारे में बात कर रहे हैं।

मेरे लिए, Object.Assign शैली साफ-सुथरी और पढ़ने में आसान है, और यही इसके पक्ष में मुख्य तर्क है।

हां यह प्रति फ़ाइल लगभग कुछ मिलीसेकंड है और केवल तभी जब फ़ाइल को जावास्क्रिप्ट इंजन द्वारा पहली बार पार्स किया जाता है ...
सामने वाले उपयोगकर्ता के लिए 3scd की सीमा को न भूलें जो अधिक प्रतीक्षा करने में सक्षम नहीं हैं!

मैं तीनjs के साथ कोणीय परियोजना बनाने की कोशिश कर रहा हूं और ऐसा हमेशा लगता है कि मैं तीनj के हर हिस्से को हैक कर रहा हूं।
सबसे पहले यह तीन स्थिरांक के साथ es5 सिंटैक्स है जो मौजूद होना चाहिए, उदाहरण के लिए, यदि मुझे OrbitalControls की आवश्यकता है।
हमारे पास तीनj टाइपिंग है, लेकिन उन्हें एक ही पैकेज में रखना अधिक सुविधाजनक होगा। टाइपिंग में OrbitalControls हैं, लेकिन हम केवल import { OrbitalControls } from 'three; की तरह आयात नहीं कर सकते।
वेबपैक में पेड़ हिल रहे हैं, इसलिए ईएस 6 के मामले में हम एक परियोजना के अंदर अपनी जरूरत की सभी चीजें शामिल कर सकते हैं और उन्हें अलग करने के लिए नहीं ले जा सकते।
@mrdoob तो टाइपस्क्रिप्ट इतना खराब क्यों है? इसे किसी भी संस्करण में टाइपिंग के साथ ES में संकलित किया जाएगा।
इसका उपयोग कई अन्य चौखटे जैसे रिएक्ट में भी किया जाता है।

@FriOne मुझे यकीन नहीं है कि @mrdoob वास्तव में सोचता है कि टाइपस्क्रिप्ट खराब है, लेकिन मुझे लगता है कि वह इस मुद्दे/थ्रेड में टाइपस्क्रिप्ट पर चर्चा करने के खिलाफ है क्योंकि यह इस धागे का विषय नहीं है। मुझे लगता है कि ES6 कक्षाएं टाइपस्क्रिप्ट के खिलाफ या उसके लिए काम नहीं करती हैं। यदि आप कोडबेस को ES6 में बदलते हैं तो कोडबेस को टाइपस्क्रिप्ट पर पोर्ट करना और भी आसान है क्योंकि इसका सिंटैक्स बहुत समान है। हां, मुझे लगता है कि टाइपस्क्रिप्ट कई नए विकल्पों को सक्षम कर सकता है। उदाहरण के लिए, यह एक अधिक अनुकूलित कोड को "ट्रांसपाइल" करने में मदद कर सकता है, यह नए डेवलपर्स को पुस्तकालय को तेजी से सीखने में मदद करता है, शायद यह भविष्य में प्रयोगों के लिए दरवाजे खोलता है जैसे: https://github.com/AssemblyScript/assemblyscript। मुझे लगता है कि टाइपस्क्रिप्ट के साथ बहुत सारे फायदे हैं @joejordanbrown ने पेशेवरों का विस्तार से वर्णन किया है।

लेकिन विषय पर वापस जाएं: मुझे लगता है कि ES6 कक्षाओं को अपनाना एक कदम आगे होगा और उसके बाद, हम टाइपस्क्रिप्ट चीज़ पर चर्चा कर सकते हैं। तो चलिए एक दूसरे के बाद एक कदम बढ़ाते हैं

@tschoartschi , सोचें कि टाइपस्क्रिप्ट es6 कक्षाओं और अन्य रिफैक्टरिंग में माइग्रेशन में मदद कर सकता है। मेरे पास माइग्रेशन का ऐसा अनुभव नहीं है, हो सकता है कि मैं गलत हूं।

@FriOne यह निर्भर करता है निश्चित रूप से टाइपस्क्रिप्ट मदद कर सकता है क्योंकि संकलक आपको आपकी सभी त्रुटियों और गलतियों को बता सकता है लेकिन आपको टाइपस्क्रिप्ट के साथ काम करने के लिए पहले पूरी बिल्ड पाइप सेट अप करने की आवश्यकता होगी। इसके अलावा, आपको यह आकलन करने की आवश्यकता है कि टाइपस्क्रिप्ट सही फिट है या नहीं। मुझे लगता है कि पहले ES6 कक्षाओं में कनवर्ट करना और फिर टाइपस्क्रिप्ट के बारे में सोचना ठीक है।

अरे, हम KTH के 5 छात्रों का एक समूह हैं जो एक कोर्स के लिए एक ओपन सोर्स प्रोजेक्ट में योगदान करना चाहते हैं और प्रोजेक्ट के एक हिस्से को नए ES6 सिंटैक्स में बदलने की कोशिश करना चाहते हैं।

मैंने कुछ उदाहरणों के साथ कुछ उदाहरणों के साथ, प्रूफ-ऑफ-कॉन्सेप्ट के रूप में कुछ समय पहले (r82) टाइपस्क्रिप्ट में तीन.जेएस पोर्ट किया था।

https://github.com/flyover/three.ts

उदाहरणों को लोड होने में थोड़ा समय लगता है, क्योंकि टाइपस्क्रिप्ट स्रोत मक्खी पर ट्रांसपाइल हो जाता है। ट्रांसपिल्ड जावास्क्रिप्ट का उपयोग करते समय वे मूल रूप से उतनी ही तेजी से लोड होते हैं।

मैं तीन.जेएस को टाइपप्रति में पोर्ट करते हुए देखना पसंद करूंगा। मुझे लगता है कि अगर इस परियोजना को अगली वेब पीढ़ियों के लिए समय की कसौटी पर खरा उतरना है तो इसके आधुनिकीकरण की सख्त जरूरत है। एक दिन, हम इसे असेंबलीस्क्रिप्ट के साथ काम करते हुए और WASM में चलते हुए भी देख सकते हैं। थ्रीज नहीं तो कुछ और जरूर होगा।

यह पूरा हो गया है @WestLangley और @mrdoob

@bhouston यहाँ क्या निष्कर्ष है?

@pkieltyka हाँ, मुझे यह भी लगता है कि टाइपस्क्रिप्ट थ्री.जेएस जैसी लाइब्रेरी के लिए बहुत मायने रखता है। सभी तकनीकी पेशेवरों के अलावा यह पुस्तकालय के उपयोग को भी आसान करेगा और नए लोगों को एपीआई का पता लगाने में मदद करेगा। लेकिन मुझे यह भी लगता है कि पहले सभी ES6 सामग्री को समाप्त करना और फिर टाइपस्क्रिप्ट पर विचार करना महत्वपूर्ण है। मुझे लगता है कि नवीनतम जावास्क्रिप्ट से टाइपस्क्रिप्ट के रूप में प्रकार जोड़ना बहुत जटिल नहीं है।

@flyover भी थ्री.जेएस के टाइपस्क्रिप्ट संस्करण के लिए एक प्रूफ-ऑफ-कॉन्सेप्ट देखें। क्या आपको Three.js के अनुरक्षकों से प्रतिक्रिया मिली?

मैं तीन.जेएस के लिए टाइपस्क्रिप्ट का भी समर्थन करता हूं। टाइपसर्प्ट मूल रूप से सबसे अच्छा है
अभ्यास और कच्ची जावास्क्रिप्ट अब और नहीं है।

शनिवार, 5 जनवरी 2019, 4:13 पूर्वाह्न को

@pkieltyka https://github.com/pkieltyka हाँ मुझे भी लगता है कि टाइपस्क्रिप्ट
थ्री.जेएस जैसी लाइब्रेरी के लिए बहुत मायने रखता है। सब के अलावा
तकनीकी पेशेवरों से यह पुस्तकालय के उपयोग को भी आसान करेगा और नए लोगों की मदद करेगा
एपीआई का पता लगाने के लिए। लेकिन मुझे यह भी लगता है कि सभी ES6 को समाप्त करना महत्वपूर्ण है
पहले सामान लें और फिर टाइपस्क्रिप्ट पर विचार करें। मुझे लगता है कि नवीनतम से
जावास्क्रिप्ट टाइपस्क्रिप्ट के रूप में प्रकार जोड़ना बहुत जटिल नहीं है।

@flyover https://github.com/flyover भी अच्छा है इसके लिए प्रूफ-ऑफ़-कॉन्सेप्ट देखें
Three.js का टाइपस्क्रिप्ट संस्करण। क्या आपको अनुरक्षकों से प्रतिक्रिया मिली?
थ्री.जेएस का?

-
आप इसे प्राप्त कर रहे हैं क्योंकि आपका उल्लेख किया गया था।
इस ईमेल का सीधे उत्तर दें, इसे GitHub पर देखें
https://github.com/mrdoob/three.js/issues/11552#issuecomment-451639995 ,
या थ्रेड को म्यूट करें
https://github.com/notifications/unsubscribe-auth/AAj6_bkdND7I0_F4AJcBV0DYLpToUIVhks5vAGykgaJpZM4N9vH8
.

@bhouston मैं मानता हूं कि टाइपस्क्रिप्ट एक बेहतरीन तकनीक है, लेकिन मैं इसे आपके द्वारा किए गए तरीके से नहीं रखूंगा। मुझे लगता है कि हमें हमेशा कच्चे जावास्क्रिप्ट के जितना संभव हो उतना करीब रहना चाहिए और शीर्ष पर टाइपस्क्रिप्ट सुविधाओं को जोड़ना चाहिए। चूंकि टाइपस्क्रिप्ट जावास्क्रिप्ट स्पेक का बहुत बारीकी से अनुसरण करता है, टाइपस्क्रिप्ट वास्तव में ES6 की तरह टाइप के साथ पढ़ता है।

तीन.जेएस जैसी लाइब्रेरी के लिए टाइपस्क्रिप्ट वास्तव में फायदेमंद हो सकता है और इसे धीरे-धीरे अपनाया जा सकता है। इसलिए हमें "बिग-बैंग" पुनर्लेखन की आवश्यकता नहीं होगी, विशेष रूप से सभी ES6 रिफैक्टर समाप्त होने के बाद नहीं।

यह सुनना दिलचस्प होगा कि क्या टाइपस्क्रिप्ट पर @mrdoob का रुख बदल गया है। टाइपस्क्रिप्ट "टाइप किए गए जावास्क्रिप्ट" के लिए "डिफैक्टो" मानक बन गया है (ध्यान दें कि मैंने अपने दावों को एस्ट्रोफ़े के तहत रखा है क्योंकि यह कोई कठिन तथ्य नहीं है)

पहला कदम ES6 सुविधाओं को अपनाना चाहिए, विशेष रूप से कक्षाएं, एरो फंक्शन, 'लेट' और 'कॉन्स्ट'।

एक बार जब हम यह कर लेते हैं कि हम टाइपस्क्रिप्ट समर्थन पर ठीक से चर्चा कर सकते हैं, जैसा कि @ रूमले-बिल्ड बताते हैं, यदि हम निर्णय लेते हैं तो ईएस 6 कोड के शीर्ष पर टाइपस्क्रिप्ट सुविधाओं को धीरे-धीरे जोड़ना आसान है।

दोनों को एक साथ करने से ऐसा लगता है कि यह मेरे लिए चीजों को अधिक जटिल बना देगा।

यह सुनकर बहुत अच्छा लगा कि टाइपस्क्रिप्ट भविष्य में किसी बिंदु पर एक विकल्प हो सकता है :-) शायद हम @flyover द्वारा किए गए कुछ कार्यों का पुन: उपयोग कर सकते हैं

लेकिन मैं पूरी तरह से सहमत हूं @looeee पहले सभी ES6 सामान समाप्त करें और फिर अगले चरणों पर ध्यान केंद्रित करें

सभी ES6 सामान समाप्त करें

मुझे खुशी होगी अगर हम कम से कम इसे शुरू कर सकें

टाइपस्क्रिप्ट के लिए एक अच्छा आधा कदम प्रत्येक जावास्क्रिप्ट फ़ाइल के बगल में टाइप फाइलें जोड़ना होगा। इस प्रकार दोनों होंगे:

वेक्टर3.जेएस
वेक्टर3.d.ts

यह हमें साइडकार फ़ाइलों के रूप में टाइपस्क्रिप्ट के सभी लाभ प्रदान करता है।

अभी एक @ प्रकार/तीन फ़ाइल है लेकिन यह पुरानी है और अलग से रखरखाव की जाती है - इस प्रकार यह हमेशा डेटा से बाहर रहेगी।

थ्री.जेएस का मुख्य प्रतियोगी बेबीलॉन्ग है और यह पूरी तरह से टाइपस्क्रिप्ट है और मेरा मानना ​​है कि इससे इसे फायदा होता है।

लेकिन @ टाइप्स/थ्री को मारना और इसे साइड कार टाइप डेफिनिशन फाइलों के रूप में थ्री प्रॉपर में एकीकृत करना एक बेहतरीन पहला कदम होगा।

हमें सभी उदाहरणों को /src में किसी प्रकार के पेड़ को हिलाने के साथ एकीकृत करने की भी आवश्यकता है।

अभी Three.JS के लिए कोड संरचना इतनी 2014 है और इसके साथ काम करने के लिए बस एक दर्द है।

सभी उदाहरण?

उदाहरण/जेएस

सोम, जनवरी 7, 2019, 10:25 पूर्वाह्न पर दुसान बोस्नजक < सूचनाएं @github.com ने लिखा:

सभी उदाहरण?

-
आप इसे प्राप्त कर रहे हैं क्योंकि आपका उल्लेख किया गया था।
इस ईमेल का सीधे उत्तर दें, इसे GitHub पर देखें
https://github.com/mrdoob/three.js/issues/11552#issuecomment-451970482 ,
या थ्रेड को म्यूट करें
https://github.com/notifications/unsubscribe-auth/AAj6_Q3Kakb5Qn2DqGbMVvLkW_28cOyaks5vA2b5gaJpZM4N9vH8
.

@भूस्टन

टाइपस्क्रिप्ट के लिए एक अच्छा आधा कदम प्रत्येक जावास्क्रिप्ट फ़ाइल के बगल में टाइप फाइलें जोड़ना होगा। इस प्रकार दोनों होंगे:

वेक्टर3.जेएस
वेक्टर3.d.ts

क्या .d.ts फ़ाइलें c में .h फ़ाइलों के रूप में कार्य करेंगी?

क्या .d.ts फ़ाइलें c में .h फ़ाइलों के रूप में कार्य करेंगी?

यह बहुत अच्छा सादृश्य है। दिलचस्प है कि किसी ने इसमें से अधिकांश पहले से ही यहां किया है: https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/three इस प्रकार वास्तव में यह केवल इन प्रकार की फाइलों का स्वामित्व लेगा और इसे Three.js में एकीकृत करेगा। यदि आप चाहें तो हम एक पीआर बना सकते हैं जो इसे तीन.जेएस में एकीकृत करता है और इसे उचित रूप से विभाजित करता है।

यह दिखाने के लिए कि टाइपस्क्रिप्ट कितनी लोकप्रिय है, देखें कि प्रति सप्ताह कितने @ प्रकार/तीन डाउनलोड किए जाते हैं:

https://www.npmjs.com/package/@types/three - प्रति सप्ताह 63,000 डाउनलोड।

प्रभावशाली!

यदि आप चाहें तो हम एक पीआर बना सकते हैं जो इसे तीन.जेएस में एकीकृत करता है और इसे उचित रूप से विभाजित करता है।

मुझे अच्छा लगता है

क्या एस्लिंट के समान कमांडलाइन जांच चलाना संभव है, यह सुनिश्चित करते हुए कि प्रकार की फाइलें और स्रोत .js फाइलें संरेखित हैं? यदि हम d.ts फ़ाइलों का स्वामित्व ले रहे हैं, तो यह बेहतर होगा कि नियमित रूप से यह सत्यापित करने का कोई तरीका हो कि वे मेल खाते हैं।

यह दिखाने के लिए कि टाइपस्क्रिप्ट कितनी लोकप्रिय है, देखें कि प्रति सप्ताह कितने @ प्रकार/तीन डाउनलोड किए जाते हैं:

https://www.npmjs.com/package/@types/three - प्रति सप्ताह 63,000 डाउनलोड।

मैं इसे विजुअल स्टूडियो कोड की लोकप्रियता के लिए और अधिक श्रेय दूंगा, क्योंकि यह स्वचालित रूप से तब होता है जब आप विजुअल स्टूडियो कोड का उपयोग उनकी स्वचालित प्रकार अधिग्रहण सुविधा के माध्यम से करते हैं।
यानी इसे नजरअंदाज नहीं किया जा सकता।

@flyover @bunnybones1 @mrdoob @looeee @donmccurdy @bhouston @roomle-build @pkieltyka @FriOne @joejordanbrown चूंकि आप सभी टाइपस्क्रिप्ट में रुचि रखते हैं, इसलिए मैं यह नोट करना चाहता था कि मैंने टाइपस्क्रिप्ट से संबंधित एक नया मुद्दा बनाया है। मुझे लगता है कि सभी टीएस चर्चाओं को वहां स्थानांतरित करना समझ में आता है। यदि आप रुचि रखते हैं तो आप इसे यहां पा सकते हैं: https://github.com/mrdoob/three.js/issues/15545

मैं ES6 कक्षाओं में पोर्ट करने के लिए समय देने को तैयार हूं। मुझे लगता है कि टाइपस्क्रिप्ट का समर्थन करने वाले एक दिन के लिए यह एक अच्छा ब्रिज समाधान होगा।

पहला कदम कुछ ऐड-ऑन को ES6 में बदलना है।

https://github.com/mrdoob/three.js/tree/dev/examples/jsm

नियंत्रण, लोडर और निर्यातक अच्छे उम्मीदवार हैं। मदद करने के लिए स्वतंत्र महसूस करें!

@mrdoob सिर्फ पुष्टि करने के लिए, आपका मतलब उन्हें ES मॉड्यूल में परिवर्तित करना है, लेकिन अभी तक अन्य ES6 सुविधाओं का उपयोग नहीं करना है, है ना?

मुझे लगता है कि रूपांतरण करने की प्रक्रिया है:

1. मूल फ़ाइल को ES मॉड्यूल में बदलने के लिए Modularize.js स्क्रिप्ट का उपयोग करें।
2. यदि आवश्यक हो तो मुद्दों को साफ करें।
3. किसी बिंदु पर (यह रिलीज़, या निकट भविष्य में) हम ES मॉड्यूल को UMD मॉड्यूल में बदलने के लिए rollup-examples.config.js का उपयोग करना शुरू करेंगे, जिस बिंदु पर examples/js में संस्करण अब इसके द्वारा बनाए नहीं रखा जाता है हाथ।
4. एक बार यह स्थिर हो जाने पर, हम ES6 सुविधाओं को पेश करने जैसे अन्य परिवर्तनों पर विचार कर सकते हैं।

@mrdoob सिर्फ पुष्टि करने के लिए, आपका मतलब उन्हें ES मॉड्यूल में परिवर्तित करना है, लेकिन अभी तक अन्य ES6 सुविधाओं का उपयोग नहीं करना है, है ना?

हाँ क्षमा करें। मुझे निर्दिष्ट करना चाहिए था।

मैंने और @bhouston ने वादा किया हुआ PR बनाया है जो अधिकांश Three.JS प्रोजेक्ट के लिए *.d.ts फाइलों का योगदान देता है। https://github.com/mrdoob/three.js/pull/15597

मैं सिर्फ ES6 कक्षाओं और टाइपप्रति परिभाषाओं की प्रतीक्षा नहीं कर सकता। हर बार जब मैं तीन.जेएस के साथ काम कर रहा होता हूं तो मुझे एक फ़ंक्शन को फिर से लागू करने के लिए कोड की सौ पंक्तियों को कॉपी करना पड़ता है जो एक अप्राप्य दायरे में होता है। अगर आपको अपने दृश्यों को अनुकूलित करना है तो यह वास्तव में काम करने का एक शानदार तरीका नहीं है। यह कार्यप्रवाह को एक नए स्तर पर ले जाएगा ताकि अंतिम रूप से कार्यों का विस्तार और ओवरराइड करने में सक्षम हो सके।
तो कृपया कक्षा के कार्यों को कम से कम "संरक्षित" करें और बिना किसी अपवाद के पहुंच योग्य बनाएं

हर बार जब मैं तीन.जेएस के साथ काम कर रहा होता हूं तो मुझे एक फ़ंक्शन को फिर से लागू करने के लिए कोड की सौ पंक्तियों को कॉपी करना पड़ता है जो एक अप्राप्य दायरे में होता है। ... तो कृपया कक्षा के कार्यों को कम से कम "संरक्षित" और बिना किसी अपवाद के पहुंच योग्य बनाएं।

@dionysiusmarquis मुझे यकीन नहीं है कि मैं समझता हूं कि आपका यहां क्या मतलब है ... मौजूदा टीएस टाइपिंग में ऐसे फ़ंक्शन हैं जिन्हें आप गलत तरीके से निजी के रूप में चिह्नित करना चाहते हैं? या वर्तमान प्रोटोटाइप-शैली वर्ग परिभाषाओं के बारे में कुछ टीएस में कठिन उपयोग करता है? क्या आप एक उदाहरण साझा कर सकते हैं?

हर बार जब मैं तीन.जेएस के साथ काम कर रहा होता हूं तो मुझे एक फ़ंक्शन को फिर से लागू करने के लिए कोड की सौ पंक्तियों को कॉपी करना पड़ता है जो एक अप्राप्य दायरे में होता है। ... तो कृपया कक्षा के कार्यों को कम से कम "संरक्षित" और बिना किसी अपवाद के पहुंच योग्य बनाएं।

@dionysiusmarquis मुझे यकीन नहीं है कि मैं समझता हूं कि आपका यहां क्या मतलब है ... मौजूदा टीएस टाइपिंग में ऐसे फ़ंक्शन हैं जिन्हें आप गलत तरीके से निजी के रूप में चिह्नित करना चाहते हैं? या वर्तमान प्रोटोटाइप-शैली वर्ग परिभाषाओं के बारे में कुछ टीएस में कठिन उपयोग करता है? क्या आप एक उदाहरण साझा कर सकते हैं?

मैं सिर्फ एक विशिष्ट परिदृश्य के लिए एक विशिष्ट छाया मानचित्र लागू करना चाहता था। यह उदाहरण के लिए getDepthMaterial को ओवरराइड करने में सक्षम होने में मदद करता। फिलहाल मैं अपने वांछित परिवर्तनों सहित प्रतिलिपि/पेस्ट संस्करण के साथ निर्माण प्रक्रिया में अपना खुद WebGLShadowMap इंजेक्ट करता हूं।
यह बहुत अच्छा होगा यदि हर एक three.js वर्ग जितना संभव हो उतना खुलासा करेगा। टाइपस्क्रिप्ट के साथ आप इच्छित उद्देश्य का वर्णन करने के लिए आसानी से private या protected के रूप में कार्यों को ध्वजांकित कर सकते हैं। उदाहरण के लिए मेरा ES6 क्लास/टाइपस्क्रिप्ट शैडोमैप इस तरह दिखता है:

interface MaterialCache {
  [uuid: string]: {[uuid: string]: MeshDepthMaterial}
}

class ShadowMap {
  public enabled: boolean = false
  public autoUpdate: boolean = true
  public needsUpdate: boolean = false
  public type: ShadowMapType

  …

  protected depthMaterials: MeshDepthMaterial[]
  protected materialCache: MaterialCache

  constructor (renderer: WebGLRenderer, objects: WebGLObjects, maxTextureSize: any) {
    …
  }

  protected getDepthMaterial (object: Object3D, material: Material) {
    …
  }
}

export { ShadowMap as WebGLShadowMap }

यह सिर्फ घर जैसा लगता है अगर आपको "निम्न स्तर" कक्षाओं को संशोधित करने की अनुमति है

कक्षाओं के संदर्भ में मेरा एक प्रश्न है। हम वेक्टर3.अनप्रोजेक्ट जैसी विधियों को क्लास सिंटैक्स में कैसे स्थानांतरित करेंगे? एक नया दायरा बनाने के लिए विधि वास्तव में बंद करने का उपयोग करती है। यह एक महत्वपूर्ण तंत्र है जो वस्तु निर्माण की मात्रा को यथासंभव कम रखता है।

क्या हमें इन मामलों में Object.assign की आवश्यकता है?
@ मुगेन87

अब आप कक्षाओं के साथ क्लोजर कर सकते हैं। यह स्पष्ट नहीं है कि उस वाक्यात्मक चीनी में कैसे नेविगेट किया जाए। StackOverflow पर मेरा उत्तर देखें: https://stackoverflow.com/questions/39297258/iife-in-es6-class-literal/56077521#56077521 (मुझे विनम्र होना चाहिए और स्वीकार करना चाहिए कि मैं पूरी तरह से नहीं समझता कि यह कैसे/क्यों काम करता है) ।)

क्षमा करें, लेकिन यह कोड एक विरोधी पैटर्न की तरह दिखता है और हमें इसे परियोजना में अनुकूलित नहीं करना चाहिए। मॉड्यूल दायरे में चरों के प्रबंधन के लिए उचित समाधान हैं। मैं इस मार्ग पर जाने का सुझाव देता हूं।

@ Mugen87 हाँ मुझे भी लगता है कि हमें मॉड्यूल-स्कोप का अच्छा उपयोग करना चाहिए। इससे ट्री-हिलिंग जैसी चीजों में भी मदद मिलेगी। इस पर पहले से ही इस तरह के कई अन्य मुद्दों पर चर्चा की जा चुकी है: https://github.com/mrdoob/three.js/issues/6241#issuecomment -398703521

क्षमा करें, लेकिन यह कोड एक विरोधी पैटर्न की तरह दिखता है और हमें इसे परियोजना में अनुकूलित नहीं करना चाहिए। मॉड्यूल दायरे में चरों के प्रबंधन के लिए उचित समाधान हैं। मैं इस मार्ग पर जाने का सुझाव देता हूं।

कोई दिक्कत नहीं है। मैंने अभी संभावना का उल्लेख किया है। यदि आपके पास एक बेहतर/क्लीनर समाधान चल रहा है, तो मैं इसे कार्रवाई में देखने के लिए उत्सुक हूं। थ्री.जेएस प्रोजेक्ट (उपयोग, स्रोत, चर्चा आदि) जेएस ज्ञान का मेरा मुख्य स्रोत रहा है, इसलिए थ्री.जेएस में नए और बेहतर प्रोग्रामिंग पैटर्न पेश करने से शायद मुझे और मेरी परियोजनाओं को भी फायदा होगा। पछताने की कोई बात नहीं। ;-)

@ Mugen87 क्या आप इस बारे में विस्तार से बता सकते हैं कि आप क्लास-आईआईएफई को एक विरोधी पैटर्न क्यों मानते हैं, यदि केवल इतना ही मैं कुछ और सीख और समझ सकता हूँ? मैं समझता हूं कि मॉड्यूल स्कोप वैरिएबल स्वाभाविक रूप से होते हैं लेकिन यह इससे अलग नहीं है कि पहले कोर कैसे बनाया जा रहा था। और कैश वेरिएबल्स का उपयोग करने वाले कई कार्यों के साथ यह सुनिश्चित करना वास्तव में महत्वपूर्ण होगा कि कोई भी फ़ंक्शन एक ही समय में टकराए या चर का उपयोग न करे - फ़ंक्शन स्कोपिंग इसे प्रबंधित करना और बनाए रखना आसान बनाता है, यही कारण है कि मैं नहीं देखता यह एक विरोधी पैटर्न के रूप में (कम से कम जब मॉड्यूल के दायरे में सभी कैश चर को फेंकने की तुलना में)।

क्या आप इस बारे में विस्तार से बता सकते हैं कि आप क्लास-आईआईएफई को एक विरोधी पैटर्न क्यों मानते हैं?

मैं ऐसे दृष्टिकोण का उपयोग नहीं करूंगा जो संभावित रूप से यहां बताए गए पेड़-झटकों को बाधित करता है: https://github.com/mrdoob/three.js/pull/14695। इसके अलावा, मुझे लगता है कि पूरा पैटर्न हैक जैसा दिखता है। कम "फैंसी" दृष्टिकोणों का उपयोग करना आमतौर पर बेहतर काम करता है। अनावश्यक बंदों से बचने से सामान्य रूप से कोड निष्पादन प्रदर्शन में भी सुधार होना चाहिए (इसे एक संदर्भ के साथ साबित नहीं किया जा सकता है लेकिन मैंने इसे कुछ समय पहले एक बात पर सुना है)।

और कैश वेरिएबल्स का उपयोग करने वाले कई कार्यों के साथ यह सुनिश्चित करना वास्तव में महत्वपूर्ण होगा कि कोई भी फ़ंक्शन एक ही समय में टकराए या चर का उपयोग न करे।

IIFE का उपयोग मुख्य रूप से गणित की कक्षाओं में किया जाता है। चूंकि हमारे पास वहां अच्छी मात्रा में परीक्षण कवरेज है ( @ जीरो 3 ने हाल ही में अधिक यूनिट परीक्षण जोड़कर बहुत अच्छा काम किया है), उन्हें हटाने को मजबूत बनाना आसान होना चाहिए।

आईआईएफई को हटाना ठीक है। मुझे लगता है कि मैं 2013 में इसके लिए जिम्मेदार हूं। यह एक स्थिर चर पैटर्न से छुटकारा पाने के लिए था जिसे बनाए रखना कठिन था। यह इस पीआर में किया गया था:

https://github.com/mrdoob/three.js/pull/2941

https://github.com/mrdoob/three.js/issues/2936

और यहां पहले भी चर्चा की:

https://github.com/mrdoob/three.js/pull/2920#issuecomment -12217793

दिलचस्प तथ्य, जब हमने इन्हें डाला, तो कोड के प्रदर्शन में कोई अंतर नहीं था।

मुझे लगता है कि रूपांतरण करने की प्रक्रिया है:

1. मूल फ़ाइल को ES मॉड्यूल में बदलने के लिए Modularize.js स्क्रिप्ट का उपयोग करें।
2. जरूरत पड़ने पर मुद्दों को साफ करें।
3. किसी बिंदु पर (यह रिलीज़, या निकट भविष्य में) हम ES मॉड्यूल को UMD मॉड्यूल में बदलने के लिए rollup-examples.config.js का उपयोग करना शुरू करेंगे, जिस बिंदु पर examples/js में संस्करण अब इसके द्वारा बनाए नहीं रखा जाता है हाथ।
4. एक बार यह स्थिर हो जाने पर, हम ES6 सुविधाओं को पेश करने जैसे अन्य परिवर्तनों पर विचार कर सकते हैं।

अरे। हो सकता है कि वह चूक गया हो, लेकिन कक्षाओं की ओर हमारा यह वृद्धिशील कदम क्या था?

1. [x] मूल फ़ाइल को ES मॉड्यूल में बदलने के लिए Modularize.js स्क्रिप्ट का उपयोग करें।
2. [x] यदि आवश्यक हो तो मुद्दों को साफ करें।
3. [ ] किसी बिंदु पर (यह रिलीज, या निकट भविष्य में) हम ES मॉड्यूल को UMD मॉड्यूल में बदलने के लिए रोलअप-examples.config.js का उपयोग शुरू करेंगे, जिस बिंदु पर उदाहरण/js में संस्करण अब इसके द्वारा बनाए नहीं रखा जाता है हाथ।
4. [ ] एक बार यह स्थिर हो जाने पर, हम ES6 सुविधाओं को शुरू करने जैसे अन्य परिवर्तनों पर विचार कर सकते हैं।

उपरोक्त चरणों में, हमने अनिवार्य रूप से चरण (1) और (2) को पूरा कर लिया है।

चरण (3) हम अब ऐसा नहीं कर रहे हैं, बल्कि किसी बिंदु पर examples/js फ़ोल्डर को हटा देंगे और हटा देंगे (देखें https://github.com/mrdoob/three.js/pull/18749) .

मुझे लगता है कि इसका मतलब है कि चरण (4), ES6 कक्षाओं को examples/jsm में पेश करना केवल (अभी के लिए) बहुत कम उदाहरणों पर किया जा सकता है जो examples/js स्रोत संस्करणों से उत्पन्न नहीं होते हैं। एक बार examples/js हटा दिए जाने के बाद, हम बाकी काम कर सकते हैं।

^लेकिन मैं यहाँ की पंक्तियों के बीच बहुत अधिक पढ़ रहा हूँ, शायद @ Mugen87 या @mrdoob पुष्टि कर सकते हैं?

आईएमओ, परियोजना को केवल मॉड्यूल कोड आधार प्राप्त करने के लिए examples/js को हटाने और हटाने पर ध्यान केंद्रित करना चाहिए। अगले चरण में, मैं कक्षा प्रवास के साथ आगे बढ़ने की सिफारिश करूंगा। उदाहरणों के साथ शुरू करना और फिर कोर को माइग्रेट करना।

उत्तम। शुक्रिया। उन तरीकों पर करीब से नज़र डालेंगे

बंद अंक से पुनर्प्रकाशित।
नमस्ते,

मैं इस मुद्दे को बनाने की कोशिश करना चाहता था और हर किसी के विचारों को छेड़ना चाहता था कि हम वर्ग प्रवास के साथ कैसे आगे बढ़ना चाहते हैं।

मैंने अब तक जो कुछ भी देखा है उसका मेरा त्वरित सारांश:

• हमें कुछ और करने से पहले उदाहरण फ़ोल्डर को हटा देना चाहिए
• src/ के कुछ भाग ऐसे हैं जो किसी भी उदाहरण द्वारा विस्तारित नहीं हैं जिन्हें परिवर्तित किया जा सकता है
• Modularize.js स्क्रिप्ट में कुछ बदलावों के साथ हम उदाहरण/js/ पर शुरू कर सकते हैं जो संबंधित उदाहरण/jsm स्क्रिप्ट उत्पन्न करता है।

क्या मुझे कुछ याद आया?

हमें कुछ और करने से पहले उदाहरण फ़ोल्डर को हटा देना चाहिए

मुझे यकीन नहीं है कि examples/js फ़ोल्डर पर किसी भी विशिष्ट अगले चरण के लिए कौन जिम्मेदार है। जब तक हम उस योजना को स्पष्ट नहीं कर सकते, मैं पसंद करूंगा कि यह चीजों को ES कक्षाओं में परिवर्तित करने से न रोके। इसी कारण से, मैं कुछ हद तक https://github.com/mrdoob/three.js/issues/11552#issuecomment -592768708 से असहमत हूं। मैं

इससे आगे, ऐसा प्रतीत होता है कि हम बस एक तिथि निर्धारित होने की प्रतीक्षा कर रहे हैं

इसके अलावा, मेरे द्वारा किए गए संशोधन के एक हिस्से के रूप में, मुझे यह टिप्पणी मिली कि वर्तमान रोलअप बिल्ड प्रक्रिया के माध्यम से अन्य ES2015 सुविधाओं को कैसे पेश किया जा सकता है। एक उदाहरण भी दिया है ।

संपादित करें: यहां एक और त्वरित उदाहरण का सार है

चलो कन्वर्जन ट्रेन शुरू करते हैं ।
फ़ाइल निर्भरता टिप्पणी ।

@ निश्चित रूप से शायद मेरे पास कुछ समय है और मुझे मदद करना अच्छा लगेगा। क्या मैं dependencies.json सूची में कुछ आइटम ले सकता हूं?

मैं

चलो चीजों पर dibs बुलाते हैं

@ निश्चित रूप से शायद Object3D जैसे गहरे पूर्वजों से विरासत से निपटने का सबसे अच्छा तरीका क्या है? उदाहरण के लिए, मैं src/audio/AudioListener.js को परिवर्तित करने में टूट-फूट में भाग गया:

[ROLLUP] bundles src/Three.js → build/three.js...
[ROLLUP] (!) Error when using sourcemap for reporting an error: Can't resolve original location of error.
[ROLLUP] src/audio/AudioListener.js: (137:1)
[ROLLUP] [!] Error: 'return' outside of function
[ROLLUP] src/audio/AudioListener.js (137:1)
[ROLLUP] 135:   };
[ROLLUP] 136: 
[ROLLUP] 137:   return AudioListener;
[ROLLUP]        ^
[ROLLUP] 138: }(Object3D));
[ROLLUP] Error: 'return' outside of function

अगर हम सही ढंग से याद कर रहे हैं, तो हम किसी भी समस्या के बारे में फ़ाइल के शीर्ष पर एक नोट बनाने जा रहे थे।

मैंने गलत समझा कि AudioListener के साथ क्या हो रहा था... कुछ डिबगिंग के बाद, मुझे लगता है कि bubleCleanup ट्रांसफ़ॉर्म में एक मिलान समस्या है। कुछ और जानकारी के लिए https://github.com/mrdoob/three.js/pull/19934#issuecomment -667411997 देखें। मैं कुछ अलग वर्गों के साथ इसमें भाग गया, इसलिए हमें बहुत आगे जाने से पहले शायद इसे हल करना होगा।

यह कुछ फाइलों के मामले में होगा लेकिन सभी के लिए नहीं। हम इस तरह के मुद्दे की आशंका कर रहे थे।

साथ चलने वालों के लिए, कृपया यहाँ पर चर्चा का एक त्वरित पठन प्राप्त करें ।

इस बीच, src/loaders !