Ich stelle mir vor, ein beliebter Anwendungsfall für <script type="module"> wäre das Laden eines "Hauptmoduls", aus dem alle Abhängigkeiten eines Projekts durch eine Baumstruktur von import -Anweisungen aufgelöst werden. Im Web scheint dies jedoch zu einem Lade-Engpass zu führen, da der Browser nicht wissen konnte, welche Skripte heruntergeladen werden müssen, bis die abhängigen Benutzer für import analysiert wurden. Vergleichen Sie dies mit einer Situation, in der alle Skripte eines Projekts in separaten <script> -Elementen in der ursprünglich bereitgestellten HTML-Datei referenziert werden. Die Skripts können alle parallel heruntergeladen werden, während und nach der HTML-Analyse.
Wird <script type="module"> einen Lade-Engpass erzeugen? Können mehrere <script type="module"> -Elemente auf einer Seite Abhängigkeiten füreinander bereitstellen, sodass der Browser JavaScript nicht unbedingt herunterladen und parsen muss, um herauszufinden, was als nächstes heruntergeladen werden soll?
Ich nehme an, das wäre ein Anwendungsfall für HTTP / 2 PUSH_PROMISE? Der Server müsste die JavaScript-Dateien statisch analysieren und ihre Abhängigkeiten im Voraus bestimmen. Aber selbst wenn dem Browser gesagt werden könnte, die Module früh herunterzuladen, würde ich mich fragen, ob die gepushten Module immer noch nicht ausführen , bis import geparst wurde. Zumindest mit <script> , ich weiß, dass sie bei der ersten Gelegenheit ausführen würden.
<script type="module"> kann wahrscheinlich Module genauso effizient laden wie <script> + ein dynamischer Modullader.
Mehrere <script type="module"> können Abhängigkeiten für einander bereitstellen. Quelle ( über IRC ):
Ich: Wenn ich eine
<script type="module" src="a.js">habe, wo "a.js"exportein Modul ist und ich auch<script type="module" src="b.js">und "b.js"import "./a.js";habe, wird dieselbe Instanz von das vom ehemaligen<script type="module" src="a.js">erstellte Modul verwendet werden?annevk: Wenn sie im selben Dokument sind, ja
Dies liegt daran, dass wiederholte Importe von einer pro-Window- "Modul-Map" (siehe die Spezifikation ):
Wenn Modulzuordnung einen Eintrag mit Schlüssel url enthält, führen Sie diesen Algorithmus asynchron mit dem Wert dieses Eintrags aus und brechen Sie diese Schritte ab.
Indem wir mehrere <script type="module"> -Elemente erstellen, können wir den "Engpass der Abhängigkeitsstruktur" vermeiden, indem wir den Browser auf die Skripte aufmerksam machen, die er bei der ersten Gelegenheit herunterladen muss.
"Modulskripte" verzögern die Auswertung eines Moduls, bis alle Abhängigkeiten abgerufen sind; während "klassische Skripte" einfach ausgeführt werden, könnte ein dynamischer Modullader theoretisch schneller sein. Wenn dieser Dynamic Module Loader jedoch auch die Ausführung in Abhängigkeiten blockiert, dauert seine Aufgabe wahrscheinlich genauso lange wie bei import . Die eigentliche Bedrohung für die Leistung besteht wahrscheinlich auch in der Vernetzung. Bewertung ist wahrscheinlich so schnell im Vergleich, dass es trivial wäre.
Tags und Links javascript html performance networking module