网站建设 之 用js写wasm

news2024/10/7 20:33:01

为什么要这么做?编译js比解释js更快是必然的

wasm是什么?

我期望是一个二进制文件

WebAssembly(又名wasm)是一种高效的,低级别的编程语言。 它让我们能够使用JavaScript以外的语言(例如C,C ++,Rust或其他)编写程序,然后将其编译成WebAssembly,进而生成一个加载和执行速度非常快的Web应用程序。

WebAssembly被设计为针对Size和Load Time进行优化的格式,可以在各个硬件平台上以native speed运行;

安全性:WebAssembly是运行在沙盒内的,甚至可以和当前的Java虚拟机共享一套环境,并且也遵守浏览器各种跨域不跨域的规章制度;

开放性:WebAssembly开放标准,不受任何一家厂商控制,并且被设计为可以和Java API和Context交互

短期上 WASM 显然无法替代 JS——工具链调试困难、包体积庞大冗余、调 OpenGL 都要走回 JS 到 WebGL,性能未必有保证等。我们的团队踩过移植 C++ 原生渲染引擎的坑,这东西不深度掌握的话,目前只适合保证一个原生 App 在 Web 上原汁原味地凑合能用。要想做到好用,或是封装成完整的引擎级 API 在上层用 JS 深度开发,保证让人难受。我也不知道 WASM 为什么能这么巧妙地卡在原生团队和 Web 团队各自的边界之外,在完整从下到上搞 UI 的正经前端项目上(而不是音视频等特殊场景)让两边用起来都这么费劲。

V8 几乎是这个星球上最先进的工业级脚本语言引擎。别管你代码怎么梭,只要你能让 V8 走在 Happy Path 上,那妥妥都是原生级性能。

ES 规范在不断演化。这门语言向下兼容性极佳并且仍然在进化。技术圈内独家的转译玩法,让隔壁还有人为 2 还是 3 站队的时候,前端们都在用 Chrome 明年才会支持的语法特性了。

NPM 背后那个巨大的娱乐圈,哦不,社区支持。

V8 的技术路线很可能已经到达瓶颈了——不少数据显示,这条路线的综合性能上限,大约相当于纯原生应用的 1/20,而 WASM 能优化到原生的 1/4 左右。问题在于,大多数前端应用是事件驱动的,JS 完全不会 60fps 执行,甚至初级开发者还常常随手 setTimeout 几十毫秒而不影响体验。对一个 3Ghz 的 CPU 来说,在 50ms 内它就能执行 1.5 亿条指令。这个数字除以 JS 损耗的 20 倍,那也是 750 万条指令啊。

也就是说,gcc或者别的能直接编译出wasm

js解释器是v8,js编译器是

V8 执行一段 JavaScript 代码流程


  1. 生成抽象语法树(AST)和执行上下文

无论你使用的是解释型语言还是编译型语言,在编译过程中,它们都会生成一个 AST。这和渲染引擎将 HTML 格式文件转换为计算机可以理解的 DOM 树的情况类似。

  • 第一阶段是分词(tokenize),又称为词法分析,其作用是将一行行的源码拆解成一个个 token。

  • 第二阶段是解析(parse),又称为语法分析,其作用是将上一步生成的 token 数据,根据语法规则转为 AST。

将代码翻译成字节码(Bytecode)

由于直接执行机器码效率高,但是运行在 512M 内存的手机上,内存占用问题也暴露出来了,因为 V8 需要消耗大量的内存来存放转换后的机器码。为了解决内存占用问题,V8 团队大幅重构了引擎架构,引入字节码,并且抛弃了之前的编译器,

字节码就是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关,字节码需要通过解释器将其转换为机器码后才能执行。

机器码所占用的空间远远超过了字节码,所以使用字节码可以减少系统的内存使用。

执行代码即时编译器(JIT)

在 Ignition 执行字节码的过程中,如果发现有热点代码(HotSpot),比如一段代码被重复执行多次,这种就称为热点代码,那么后台的编译器 TurboFan就会把该段热点的字节码编译为高效的机器码,然后当再次执行这段被优化的代码时,只需要执行编译后的机器码就可以了,这样就大大提升了代码的执行效率。

Java 和 Python 的虚拟机也都是基于即时编译(JIT)(字节码配合解释器和编译器)实现的。具体到 V8,就是指解释器 Ignition 在解释执行字节码的同时,收集代码信息,当它发现某一部分代码变热了之后,TurboFan 编译器就把热点的字节码转换为机器码,并把转换后的机器码保存起来,以备下次使用。

js没有编译器,因为js是嵌在html的,脱离html并没有其他应用场景

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/169303.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Linux】进度条小程序

目录一.\r && \n二.行缓存区概念问题:解答:检测:三.进度条1.进度动态条2.进度百分比3.小装饰4.颜色该篇博客会主要按步骤推导出一个在Linux上运行的进度条小程序,会用到vim编辑器和gcc编译器,如果对这两个软件…

Centos7安装、卸载nginx及配置,配置成系统服务(一步到位)

目录 前言 一、下载安装解压 1.进入临时文件夹里(随便一个都行) 2.下载并安装nginx压缩包 3.解压该压缩包 4.创建目标文件夹 5.(默认会安装在/usr/local/nginx)这里通过configure命令指定安装目录 6.编译安装 7.最后生成的…

一、初始Numpy

1、numpy简介 简介 Numpy(Numerical Python)是Python语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库 Numpy的前身Numeric最早是有Jim Hugunin与其他协作者共同开发,20…

十五天学会Autodesk Inventor,看完这一系列就够了(九),主题/色彩/单位设置

众所周知,Autocad是一款用于二维绘图、详细绘制、设计文档和基本三维设计,现已经成为国际上广为流行的绘图工具。Autodesk Inventor软件也是美国AutoDesk公司推出的三维可视化实体模拟软件。因为很多人都熟悉Autocad,所以再学习Inventor&…

使用SpringBoot创建web项目,并使用外部Tomcat

使用SpringBoot创建web项目,并使用外部Tomcat 目录使用SpringBoot创建web项目,并使用外部Tomcat简单介绍:特点:步骤简介下面就使用SpringBoot创建一个web工程,并且使用外部的Tomcat和实现对jsp的支持:一、创…

AIDL 应用间简单通信demo及基本问题

AIDL:Android Interface Definition Language,即Android接口定义语言。 他的作用大家已经知道了,有些童鞋对于其中的使用细节可能会有一些理解误差,并且会造成一写异常或者通讯失败。 我们先看几个关键点再看代码,如果项目不符合这几点&…

ffmpeg编译android平台-(ubuntu+ndkr16b+ffmpeg3.4.12)

一、环境配置 1、下载NDK,NDK老版本 1.1、 ubuntu下载 wget https://dl.google.com/android/repository/android-ndk-r16b-linux-x86_64.zip1.2、解压NDK unzip android-ndk-r16b-linux-x86_64.zip1.3、配置NDK环境变量 vim /etc/profile1.4、 在profile文件中添加如下内容…

String.prototype.matchAll called with a non-global RegExp argument

如上 matchAll这个API 与 正则的全局匹配是不一样的。他会将匹配到的所有字符串以迭代器的形式返回出来。 我们可以使用Array.from或者数据解构来获得匹配到的数组。 他与正则全局匹配的区别是当正则表达式包含()捕获组的时候,全局匹配无法获得子匹配组的数据。 …

【Datewhale一起吃瓜 Task1】周志华西瓜书第一章+第二章

这里写目录标题机器学习是干什么的机器学习的理论基础: PAC模型基本术语关于数据关于假设关于模型训练机器学习任务分类归纳偏好模型的评估和选择训练流程划分数据集的方法留出法交叉验证自助法性能度量机器学习是干什么的 我们目前处于大数据时代,每天会产生数以亿…

一个监控系统的典型架构是什么样的

典型架构 采集器是负责采集监控数据的,采集到数据之后传输给服务端,通常是直接写入时序库。然后就是对时序库的数据进行分析和可视化,分析部分最典型的就是告警规则判断(复杂一些的会引入统计算法和机器学习的能力做预判),即图上的告警引擎,告警引擎产生告警事件之后交给…

华为MPLS跨域带RR实验配置

目录 Option B方案实验配置 配置建立Vpnv4邻居 配置反射器 配置RR和ASBR取消RT值检测 配置ASBR相连接口开启MPLS 配置ASBR向RR发送路由时更改下一跳 Option C1方案实验配置 Option C2方案实验配置 接口IP地址、底层IGP路由协议(ISIS)、MPLS LDP协…

一种环状二肽3705-26-8,cyclo(Pro-Phe),环(PHE-PRO)环状二肽

基础产品数据(Basic Product Data):CAS号:3705-26-8中文名:环(PHE-PRO)英文名:cyclo(Pro-Phe),CYCLO(-PHE-PRO)结构式(Structural):详细产品数据(…

qq消息撤回

开发工具 工具名称工具类型说明AndroidStuduo编辑工具开发工具jadxjava工具将apk解成java项目xposed插件工具插件qq版本8.8.80 开始 先通过jadx把apk反编译出来源码,通过build出来,在android studio打开,方便分析。 要撤回自己的消息&…

TMC步进电机驱动stealthChop

一直觉得tmc系列的芯片功能很强大,但是我自己读寄存器手册的感觉就是每个字我都认识,怎么就这么难懂。。。。 stealthChop 是一种电压控制技术,基于电压斩波器的工作远离,可在低速中速范围内以最大扭矩实现绝对静音的步进电机控制…

【推荐】自用软件工具推荐 WIN

一、图片查看器 Honeyview 蜂蜜浏览器 免费的图像查看器 下载和功能说明 (bandisoft.com) 轻量而快速可以显示包括 GPS 信息在内的 JPEG 格式的 EXIF 信息对图像格式进行批量转换和调整大小支持显示 GIF 和 WebP 动图无需解压即可直接查看压缩包中的图像支持的格式 图像格式…

大厂整个项目的开发规范流程

第1节、大厂码农开发基础 内容 本章节给大家介绍在互联网做开发,基础环境、开发技术以及上线和监控都会用到哪些东西。一般互联网大厂像阿里、京东、腾讯等都会有公司自研的一些技术组件,比如:RPC、MQ、数据库路由等,但所有的这些…

API 网关的功能用途及实现方式

1. API 网关诞生背景 前言 API 经济生态链已经在全球范围覆盖, 绝大多数企业都已经走在数字化转型的道路上,API 成为企业连接业务的核心载体, 并产生巨大的盈利空间。快速增长的 API 规模以及调用量,使得企业 IT 在架构上、模式…

flume整合数据到kafka,sparkStreaming消费数据,并存储到hbase和redis中

目录 1、模拟数据生成 2、flume采集数据 1、node01配置flume的conf文件 2、node02开发flume的配置文件 3、node03开发flume的配置文件 4、开发flume启动停止脚本 5、node01执行以下命令创建kafka的topic 6、启动并查看kafka的数据 3、SparkStreaming消费kafka中的数…

第二章.线性回归以及非线性回归—LASSO算法

第二章.线性回归以及非线性回归 2.13 LASSO算法 1.前期导入: 通过构造一个一阶惩罚函数获得一个精炼的模型;通过最终确定一些指标(变量)的系数为零,解释力很强 岭回归估计系数等于0的机会微乎其微,造成筛选变量困难 擅长处理具有…

如何实现根据环境切换不同配置?

在企业开发中,系统的配置信息往往会分不同的环境,如开发环境、测试环境、生产环境。当我们使用nacos做为配置中心时,一定会遇到的问题就是在应用中配置nacos的server-addr时测试环境的nacos地址和线上nacos地址如何区分的问题 拿开发环境和正…