Heim > Artikel > Backend-Entwicklung > Laden Sie Brotli-komprimiertes WASM
Laden Sie Brotli-komprimiertes WASM
- WBOYnach vorne
- 2024-02-13 16:21:08519Durchsuche
In den letzten Jahren hat sich die Entwicklung der Front-End-Technologie von Tag zu Tag verändert, und wir führen ständig Innovationen durch. Unter ihnen ist „Laden von brotli-komprimiertem WASM“ ein Thema, das viel Aufmerksamkeit erregt hat. Es kann Webentwicklern dabei helfen, komprimierte Daten effizienter zu laden und zu analysieren und so die Leistung von Webseiten und das Benutzererlebnis zu verbessern. In diesem Artikel stellt PHP-Editor Zimo die Prinzipien und die Verwendung dieser Technologie vor, um Ihnen zu helfen, diese Front-End-Technologie besser zu beherrschen. Lassen Sie uns gemeinsam dieses spannende Feld erkunden!
Frageninhalt
Ich habe eine brotli-komprimierte WASM-Datei main.wasm.br. Ich habe es manuell über CLI komprimiert.
Derzeit habe ich in meiner HTML-Datei Folgendes -
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Go WASM</title>
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
go.run(result.instance);
});
</script>
</head>
<body></body>
</html>
Dadurch wird die unkomprimierte WASM-Datei geladen. Wenn ich es in WebAssembly.instantiateStreaming(fetch("main.wasm.br"), go.importObject) ändere, erhalte ich die folgende Fehlermeldung:
<code> Uncaught (in promise) TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'. </code>
Wie lade ich es in HTML?
Lösung
Vielen Dank an alle, die kommentiert und mich zur Lösung geführt haben.
Es kommt also nur darauf an, die Grundlagen von HTTP-Anfragen/-Antworten zu verstehen -
Content-Type Steuert den tatsächlichen Datentyp des Antwortinhalts.
Content-Encoding Steuern Sie, welche Kodierungs-/Komprimierungslogik wir zum Kodieren von Antwortinhalten verwenden.
In meinem Fall habe ich die WASM-Datei manuell mit gzip komprimiert und NginX wie folgt konfiguriert -
location ~ \.wasm {
default_type 'application/wasm';
add_header 'Content-Encoding' 'gzip';
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
}
Sie können Ihr Makefile oder Build-Skript so konfigurieren, dass WASM jedes Mal komprimiert wird, wenn Sie Ihr Projekt erstellen.
Das obige ist der detaillierte Inhalt vonLaden Sie Brotli-komprimiertes WASM. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!