web-dev-qa-db-fra.com

Comment puis-je vérifier si un navigateur prend en charge WebAssembly?

Avec la prise en charge de WebAssembly dans tous les nouveaux principaux navigateurs, comment puis-je vérifier si le navigateur actuel qui visite mon site Web le prend en charge?

browserwebassembly
22
Ayush Gupta

Il existe plusieurs façons de détecter la présence de WebAssembly. La base est de vérifier si WebAssembly si de type "object" dans la portée globale, mais la "portée globale" est une chose difficile à obtenir dans différents environnements JavaScript (thread principal du navigateur, travailleur, node.js).

Cela n'est pas non plus techniquement suffisant car vous pourriez avoir la prise en charge de WebAssembly mais être incapable de compiler ou d'instancier réellement à cause de CSP (et exactement ce que CSP interdit n'est pas encore standardisé, travail en cours ici ).

Une vérification prudente pourrait être la suivante:

const supported = (() => {
    try {
        if (typeof WebAssembly === "object"
            && typeof WebAssembly.instantiate === "function") {
            const module = new WebAssembly.Module(Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
            if (module instanceof WebAssembly.Module)
                return new WebAssembly.Instance(module) instanceof WebAssembly.Instance;
        }
    } catch (e) {
    }
    return false;
})();

console.log(supported ? "WebAssembly is supported" : "WebAssembly is not supported");

Il fait ce qui suit:

  • Vérifiez si WebAssembly est accessible dans la portée actuelle. Si ce n'est pas mondial, on s'en fout vraiment!
  • Voir s'il a le .instantiate fonction, que nous n'utilisons pas réellement ici mais que vous voudriez utiliser lorsque vous instanciez réellement car elle est asynchrone et peut gérer de gros modules sur le thread principal ou hors tension.
  • Essayez de compiler de façon synchrone le plus petit module possible (nombre magique '\0', 'a', 's', 'm', suivi du numéro de version 1 codé en uint32), et voyons si nous obtenons un WebAssembly.Module en dehors de ça.
  • Enfin, essayez d'instancier de façon synchrone ce module et vérifiez qu'il s'agit d'un WebAssembly.Instance.

C'est un peu trop, mais cela devrait fonctionner indépendamment de:

  • Où le code est en cours d'exécution (thread principal, travailleur, node.js).
  • Comment le CSP finit par être standardisé.
36
JF Bastien