Qu’est-ce que WebAssembly? Et peut-il accélérer votre site?

par | Mai 15, 2019 | News, Site e-commerce, Site internet, Site Web mobile, Tous les articles RSS | 0 commentaires

WebAssembly est un projet vraiment cool qui compile d’autres langages de code afin qu’ils puissent s’exécuter dans le navigateur avec JavaScript. Il est nettement plus rapide que beaucoup de ses concurrents. Il permet à un plus grand nombre de sites de traitement de données et de traitement de données de fonctionner de manière plus fluide et rapide qu’autrement. Dans cet article, nous examinerons la technologie d’un point de vue descendant – en décrivant en quoi elle consiste et pourquoi vous en avez peut-être besoin.

Qu’est-ce que WebAssembly?

Sur le plan technique, WebAssembly est un format de codage binaire « binary encoding format  » qui, comme le dit la documentation d’origine, «permet les petits fichiers, le décodage rapide et l’utilisation réduite de la mémoire». Il a été conçu pour extraire le code de la machine.
Tout comme les langages tels que C ou C ++ (ou R, etc.). Ensuite, il compile cela dans WebAssembly (ou wasm), qui est ensuite exécuté dans le navigateur comme JavaScript.
Fondamentalement, il prend le code exécutable et l’exécute dans le navigateur. Cela signifie pour les développeurs que vous pouvez travailler plus directement avec le navigateur, comme si vous interagissiez avec l’ordinateur de l’utilisateur au niveau de la machine.
Vous n’avez plus besoin de suivre les étapes parfois compliquées que nécessite JavaScript. WASM vous permet d’exécuter des jeux et des applications à part entière dans le navigateur comme s’ils fonctionnaient sur la machine elle-même.
C’est presque comme si une machine virtuelle idéale exécutait les commandes.
Il existe des exemples de Doom 3 exécuté uniquement dans WebAssembly, ainsi que dans  Figma.Même si vous n’avez pas un projet aussi ambitieux, WebAssembly mérite un coup d’œil, car il peut accélérer à peu près tout site lourd de JS, car il permet de conserver calculs nécessaires loin de JavaScript et entre les mains d’un outil qui les gère mieux.

Pourquoi WebAssembly au lieu de JavaScript?

Eh bien, tout d’abord, n’y pensez pas comme une décision. WebAssembly a été conçu pour fonctionner avec JS, pas pour le remplacer. Certains scripts peuvent être exécutés dans JS, tandis que d’autres sont exécutés via WASM. De plus, ce n’est pas une technologie marginale. Au moment de la rédaction de ce document, Chrome, Firefox, Safari, Android et même Microsoft Edge (!) Prennent en charge WebAssembly.

C’est en partie pourquoi l’utilisation de WebAssembly pour WordPress et d’autres applications Web est si attrayante. Il est déjà devenu une norme de codage adoptée par tous les principaux acteurs. Y compris Microsoft. Et nous savons tous à quel point ils peuvent être hésitants à propos de ce genre de chose. Donc, s’il y avait une raison de commencer à envisager comment l’utiliser, c’est tout.

De plus, nous savons que JavaScript peut faire des choses étonnantes (regardez le nouvel éditeur de blocs WP ou Divi, tous deux écrits dans React.js). Mais ce n’est pas génial à tout point. WebAssembly vous donne les outils nécessaires pour rendre des visuels et des animations haut de gamme, en fonction des fonctionnalités et des interactions que vous souhaitez utiliser avec JavaScript.

Jusqu’à WebAssembly, si vous vouliez faire cela et scinder vos ressources et vos calculs, des plug-ins et des extensions de navigateur seraient nécessaires. Maintenant, en parallèle de HTML5 et de JavaScript, WASM fait en sorte que tout ce que vous pouvez faire (à peu près) puisse être compilé, exécuté et rendu dans le navigateur lui-même. Sans perte de performance ni de puissance.

Utiliser WASM

Pour commencer, vous aurez besoin d’une sorte de code en C, C ++, R, etc. Ensuite, vous devez télécharger le kit de développement Emscripten SDK, qui vous permet d’utiliser ce code et de le compiler dans WASM.

Cependant, beaucoup d’entre vous sont des développeurs Web et n’ont peut-être pas ce niveau de polyglotitude. C’est bon. Vous pouvez également écrire directement dans le style de « WebAssembly text style »ou utiliser votre TypeScript dans WASM.

Ensuite, vous l’exécutez comme toute autre application Web de votre environnement ou de votre CMS. De plus, les contributeurs discutent actuellement de la possibilité d’importer directement des scripts WASM sous forme de modules, comme vous le faites déjà avec ECMAScript (ES6). Il vous suffira d’indiquer le type de script = ‘module ’et que le src sera exemple.wasm au lieu d’exemple.js.

WebAssembly est-il donc pour vous?

Honnêtement, pour l’utilisateur typique de CMS tel que WordPress et Joomla, le blogueur, créateur de contenu et propriétaire de petite entreprise, WebAssembly ne vous concernera probablement jamais. Et oui, il peut vraiment accélérer votre site en raison de la manière dont il gère les calculs, mais il ne vaut probablement pas la peine de s’emparer d’un développeur et de le faire retravailler pour de bonnes choses. La plupart des sites WP ne sont pas assez robustes pour exiger la compression et les calculs qui font briller WebAssembly.

Mais si vous êtes un développeur qui utilise le Web comme maison pour votre application Web (et par là, nous entendons des applications Web progressives, et pas seulement des vitrines et des services de diffusion de contenu, sauf si vous êtes très populaire), WebAssembly rendra probablement votre site Web. courir de manière exponentielle plus rapide. Si vous avez beaucoup d’interactions et de rendu graphique, consultez WASM. Ça va le rendre meilleur. Si vous fournissez des analyses et une gestion des données en temps réel (comme un logiciel de gestion de la relation client), WebAssembly a été conçu pour vous.

Fondamentalement, si vous effectuez une tonne de calculs en même temps que vos utilisateurs interagissent avec le site Web, WebAssembly vaut la peine d’être examiné. Si vous appelez un grand nombre de fichiers et de modules JavaScript distincts, consultez WebAssembly. Il y a de très bonnes chances que votre site s’améliore beaucoup, pas seulement sur le back-end et la réduction des ressources, mais aussi pour les utilisateurs. Ils auront une bien meilleure expérience de votre produit.

Don`t copy text!