Three.js: Den Styleguide noch einmal durchsuchen?

Erstellt am 19. Juli 2018  ·  16Kommentare  ·  Quelle: mrdoob/three.js

Ich bin mir sicher, dass dies eine Dose Würmer öffnet, aber der [Styleguide] scheint ein wenig veraltet zu sein und ich möchte 2 Änderungen vorschlagen

bevorzugen const und let gegenüber var ?

Ich weiß nicht, warum var bevorzugt wird (wurde in einer kürzlich veröffentlichten PR zu var aufgefordert). Ich vermute, dass es dort angefangen hat und weil const und let sind. Aber jetzt, da die Codebasis ES5-Module verwendet, scheint es, als ob jeder Grund, var beizubehalten, lange vorbei ist. Wegen der import Zeilen muss der Code durch einen Transpiler laufen, damit Code in Browsern funktioniert, die nur var . Derselbe Transpiler wandelt const und let in var .

Darüber hinaus gibt es konkrete objektive Vorteile bei der Verwendung von const und let über var . Beide sind auf geschweifte Klammern anstatt auf Funktionsumfang beschränkt. Erstellen Sie keine globalen Variablen im Gegensatz zu var . Sicher, ein Großteil des Codes verwendet jetzt var (obwohl IIRC eslint das automatisch beheben kann). Das Ändern des Linters, sodass const und let erforderlich sind, und das langsame Ändern des Legacy-Codes verhindert weitere Fehler und Lecks. Auch mit const und let die überall verwendet werden, ist es möglich, eslint zu aktivieren, um nach mehr undefinierten Variablen zu suchen, was zumindest für mich eine große Hilfe war.

Es gab eine Zeit, in der var schneller war, aber diese Zeit ist lange vorbei.

Ist es an der Zeit, var ?

Erlaube nachgestellte Kommas in mehrzeiligen Arrays und Objekten

Dies mag eine persönliche Präferenz von Mr. Doob sein, aber ich vermute eher, dass es aus IE-Tagen übrig geblieben ist. Der IE unterstützte kein abschließendes Komma, aber jetzt, da das Transpilieren stattfindet, werden die abschließenden Kommas vom Transpiler aus Gründen der IE-Kompatibilität entfernt. Für Entwickler sind nachgestellte Kommas ein Gewinn, da sie zu weniger Fehlern führen. Fehler, die normalerweise abgefangen werden, aber Fehler, die oft mindestens eine Iteration erfordern, um sie abzufangen, im Browser auszuführen und den Syntaxfehler zu sehen, dann zurückzugehen und Kommas zu bearbeiten. Zumindest meiner Erfahrung nach vermeiden Kommas dieses Problem.

Mit abschließenden Kommas in mehrzeiligen Arrays und Objekten meine ich zum Beispiel

 const sizes = [
     100,
     200,
     300,
 ];

und

 const options = {
    width: 100,
    height: 200,
    depth: 300,
};

Bei nachgestellten Kommas erfordert das Hinzufügen oder Entfernen von Zeilen nur den Umgang mit einer einzigen Zeile. Bei abschließenden Kommas bedeutet dies, dass Sie immer das letzte Komma beachten und es entfernen oder hinzufügen müssen.

Was auch immer entschieden wird, ist natürlich in Ordnung, ich werde dem Leitfaden für PRs folgen. Ich dachte nur, ich würde fragen, wie der Code auf ES5-Module umgestellt hat, ob es an der Zeit ist, einige der Styleguides noch einmal durchzusehen (beachten Sie, dass der Teil var nicht wirklich im Styleguide enthalten ist.)

Suggestion

Hilfreichster Kommentar

JS-Interpreter entfernen dieses Komma heutzutage?

Alle Browser sind mit diesem Komma in Arrays und Objekten für > 10 Jahre in Ordnung, außer IE

Lassen Sie mich hinzufügen, anstatt es als seltsam anzusehen, ein anderer POV ist, dass die Syntax tatsächlich das Komma ist, es ist nur der Browser gibt Ihnen eine Pause und erfordert nicht das letzte. Das Seltsame einer Person ist die Verschönerung einer anderen Person. Ich finde es persönlich angenehmer, dass die Konsistenz jeder Zeile gleich ist, als dass die letzte Zeile anders ist. Natürlich sind das persönliche Vorlieben, die ich nur auf eine andere Art und Weise anspreche, die Dinge zu betrachten.

Was die Diffs angeht, habe ich diese Vergleiche online gefunden

kein nachgestelltes Komma diff beim Hinzufügen einer Zeile

nachgestelltes Komma diff Hinzufügen einer Zeile

Alle 16 Kommentare

Es gab eine Zeit, in der var schneller war, aber diese Zeit ist lange vorbei.

Worauf stützt du das? IIRC das letzte Mal, als wir dies getestet haben, gab es keinen Unterschied für const aber let war etwas langsamer. Es wäre gut, einige aktualisierte Tests dazu zu sehen.

Erlaube nachgestellte Kommas in mehrzeiligen Arrays und Objekten

Stimmen Sie dieser Änderung auf jeden Fall zu, wenn es keine Probleme mit dem IE gibt (wir möchten immer noch mindestens IE 10 und 11 unterstützen, oder?).

Es gab eine Zeit, in der var schneller war, aber diese Zeit ist lange vorbei.

Worauf stützt du das? IIRC das letzte Mal, als wir dies getestet haben, gab es keinen Unterschied für const aber let war etwas langsamer. Es wäre gut, einige aktualisierte Tests dazu zu sehen.

Ja, einige Zahlen würden bei dieser Entscheidung helfen.

Erlaube nachgestellte Kommas in mehrzeiligen Arrays und Objekten

Mit abschließenden Kommas in mehrzeiligen Arrays und Objekten meine ich zum Beispiel

const sizes = [
    100,
    200,
    300,
];

Mein Gehirn liest das so:

 const sizes = [
     100,
     200,
     300, undefined
 ];

JS-Interpreter entfernen dieses Komma heutzutage?

Ich persönlich stimme nicht dafür, nachgestellte Kommas in mehrzeiligen Arrays zuzulassen, da ich es auch ungewöhnlich finde, sie zu lesen.

Für mich besteht der Zweck von nachgestellten Kommas darin, dass es schneller ist, Dinge hinzuzufügen und zu entfernen sowie sie durch Ausschneiden / Einfügen neu anzuordnen. Sie müssen sich keine Sorgen machen, ob Sie gerade das letzte Element ausschneiden oder nicht, jede Linie ist gleich. Wie für das Sehen undefined , es ist leicht zu vermeiden, wenn Sie wissen , dass es nur ein Element pro Zeile - und in Fällen , in denen das Array auf einer Linie wie [1, 2, 3, 4, 5] würden Sie nicht ein Komma hinzufügen.

Auf der anderen Seite denke ich, dass es so oder so nicht wichtig ist. Der Wechsel zu const / let ist hier das wichtigste Thema.

... aber jetzt, wo transpiliert wird ...

Wir transpilieren nicht, oder? Rollup ersetzt lediglich die ES6-Import-/Export-Syntax, während alles andere allein gelassen wird, es sei denn, Sie fügen Plugins wie rollup-plugin-buble hinzu . Aber let / const werden im IE11 sowieso unterstützt.

Die nachgestellten Kommas dienen auch einem viel größeren Zweck als nur der "Benutzerfreundlichkeit". In größeren Projekten, zu denen viele Leute beitragen, ist es nützlich, Dinge wie git blame zu verwenden, um herauszufinden, wer für welchen Codeabschnitt verantwortlich ist.

Um das Offensichtliche hier zu @mrdoob hinzugefügt wurden, und ich dort später eine Zeile hinzufügen würde, würde mein Name in der letzten Codezeile angezeigt, die ich nicht geschrieben habe.

Ich persönlich bin aus genau dem gleichen Grund wie die Leute vor mir gegen die Verwendung von nachgestellten Kommas, aber ich sehe die Vorteile und gewöhne mich jetzt daran, dass wir dies seit diesem Jahr auch im Büro durchsetzen.

JS-Interpreter entfernen dieses Komma heutzutage?

Ja.

Bezüglich der Verwendung von let vs. var :

Der Unterschied zwischen let und var heutzutage keine Rolle mehr, wenn es um die Leistung geht. V8 und Spidermonkey (Firefox) haben heutzutage großartige Optimierungen, die wirklich gut funktionieren.

Siehe diesen Beitrag für eine Ausarbeitung (stellen Sie sicher, dass Sie die tatsächlichen Ausschnitte ausführen, um zu sehen, dass der Unterschied jetzt ziemlich vernachlässigbar ist): https://stackoverflow.com/questions/37792934/why-is-let-slower-than-var- in-a-for-loop-in-nodejs

Die akzeptierte Antwort auf diese SO-Frage weist auch auf die Unterschiede zwischen var und let aus funktionaler Sicht hin, da beide _sehr_ unterschiedliche Bedeutungen und Anwendungsfälle haben, falls das nicht klar ist zu irgendjemandem.

Die Verwendung von const für Variablen, die sich nie ändern, ist ein Kinderspiel. Wenn die Javascript-Engine erkennt, dass eine Variable mit const deklariert ist, weiß sie, dass sich ihr Wert nie wieder ändert, sodass sie stark optimiert werden kann.

Nur meine 2 Cent.

Als Referenz:

Das abschließende Komma ist eines der besten js-Muster, die ich gesehen habe, und macht Diffs viel besser lesbar.

JS-Interpreter entfernen dieses Komma heutzutage?

Alle Browser sind mit diesem Komma in Arrays und Objekten für > 10 Jahre in Ordnung, außer IE

Lassen Sie mich hinzufügen, anstatt es als seltsam anzusehen, ein anderer POV ist, dass die Syntax tatsächlich das Komma ist, es ist nur der Browser gibt Ihnen eine Pause und erfordert nicht das letzte. Das Seltsame einer Person ist die Verschönerung einer anderen Person. Ich finde es persönlich angenehmer, dass die Konsistenz jeder Zeile gleich ist, als dass die letzte Zeile anders ist. Natürlich sind das persönliche Vorlieben, die ich nur auf eine andere Art und Weise anspreche, die Dinge zu betrachten.

Was die Diffs angeht, habe ich diese Vergleiche online gefunden

kein nachgestelltes Komma diff beim Hinzufügen einer Zeile

nachgestelltes Komma diff Hinzufügen einer Zeile

Beginnen wir zuerst mit let und const . Ein Schritt auf einmal.

screen shot 2018-07-30 at 5 03 00 pm

Ich denke, diese Timings sind zu kurz, um sie zu nennen. Ich bekomme andere Ergebnisse

screen shot 2018-07-31 at 9 13 50

Obwohl sie in Chrome 70 nicht annähernd nah dran sind

screen shot 2018-07-31 at 9 15 36

wenn wir schon dabei sind

screen shot 2018-07-31 at 9 19 20

screen shot 2018-07-31 at 9 20 18

Lassen Sie mich einen weiteren POV für nachgestellte Kommas hinzufügen 😜 Sie können nachfolgende Kommas als ähnlich dem Semikolon sehen

Das ist vollkommen legaler Code

 {
      doThis();
      doThat();
      doOther()
 }

In der letzten Zeile fehlt das Semikolon. Ein POV ist, Komma als dasselbe zu sehen. Vielleicht ist es wie die Leute/Lampen-Illusion.

Ob Sie 2 Personen oder einen Lampenstab sehen, beides ist gültig. Aber in diesem Fall mit Komma, da beide POVs passen ("Komma am Ende sieht aus wie , undefiniert" vs "Komma fehlt sieht inkonsistent aus") hat das eine objektive Vorteile und das andere nicht ...?

Ich habe versucht, irgendwo im Code ein const hinzuzufügen, und es wird nicht mehr kompiliert ...

screen shot 2018-07-30 at 5 58 46 pm

@mrdoob Das Ausgabeformat sollte auf ES6 anstelle von ES oder ES5 .

Schließung zugunsten von #6419.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen