转:WebGL、Asm.js和WebAssembly概念简介
WebGL、Asm.js和WebAssembly概念简介
转:http://www.techbrood.com/zh/news/webgl/webgl%E3%80%81asm_js%E5%92%8Cwebassembly%E6%A6%82%E5%BF%B5%E7%AE%80%E4%BB%8B.html
iefreer 发表于 2017-02-27 13:00:56
标签: webassembly, webgl, html5, asm.js
随着HTML技术的发展,网页要解决的问题已经远不止是简单的文本信息,而包括了更多的高性能图像处理和3D渲染方面。
这正是要引入WebGL、Asm.js和WebAssembly这些技术的原因。
什么是WebGL
WebGL是为了给Web添加类似桌面(或移动)系统上的OpenGL的特性支持,从而实现强大的3D图形渲染效果。
什么是Asm.js
Asm.js是一个JavaScript的一个严格的子集,可以被用来作为一个底层的、高效的编译器目标语言。asm.js提供了一个类似于C/C++虚拟机的抽象实现,包括大型二进制堆、整型和浮点运算、高阶函数定义、函数指针等语法特性。具体来说,就是通过VM(如Emscripten)把一些本地代码(如C语言)生成的VM字节码(bytecode)翻译成前述严格子集的JS代码得以在Web上运行,并通过浏览器的支持,得到性能优化。
c/c++---->Emscripten(VM)---->asm.js(一种js语言)。
什么是WebAssembly
那么WebAssembly(简称wasm)又是什么鬼?顾名思义,看起来是在Web中引入的低级语言,其目的和Asm.js类似,也是要支持本地代码的运行从而获得媲美原生应用的高性能,我们可以先观摩一个使用WebAssembly技术的在线网页游戏实例,该游戏性能可媲美原生应用。那么既然有了Asm.js,为什么还需要WebAssembly?因为Asm.js只有Mozzila支持,而WebAssembly是Mozzila、Google、Microsoft以及一些其他组织拟联手制定的游戏规则,另外WebAssembly最终将从JS中分离出来,成为一个相对独立的编译器目标语言,这样可以不必为了本地代码的运行,而在JS中引入太多内容,将来Wasm和JS会是分工合作的关系。
WebGL和WebAssembly的区别
第一眼看到WebAssembly的时候,我们或许会自然的想到其对WebGL的影响。因为通过WebAssembly可以直接把原生代码(如c/c++语言)应用在浏览器中运行,那么理论上(理想情况下),我们可以在网页上运行PhotoShop或者魔兽争霸这样的大型软件(只要通过WebAssembly给移植过来)而无需重新编写JS代码。但实际上我们需要厘清这2个概念是两个层面的东西,WebAssembly是网页低级语言,WebGL是浏览器实现的接口标准,允许客户端脚本语言(即ECMAScript,JavaScript,Webassembly)使用原生3D图形库。WebAssembly对应于汇编语言,而WebGL对应于OpenGL或DirectX。所以WebAssembly依赖于WebGL来实现3D渲染。其影响在于,有了WebAssembly,WebGL在后续标准制定中需要多提供一个低级语言接口,工程师在实现网页3D应用的时候除了JS之外多了一种选择(可以使用原生语言和wasm)。
转:WebGL、Asm.js和WebAssembly概念简介的更多相关文章
- 【转】asm.js 和 Emscripten 入门教程
Web 技术突飞猛进,但是有一个领域一直无法突破 ---- 游戏. 游戏的性能要求非常高,一些大型游戏连 PC 跑起来都很吃力,更不要提在浏览器的沙盒模型里跑了!但是,尽管很困难,许多开发者始终没 ...
- 转:asm.js 和 Emscripten 入门教程
转:http://www.ruanyifeng.com/blog/2017/09/asmjs_emscripten.html asm.js 和 Emscripten 入门教程 作者: 阮一峰 日期: ...
- Asm.js: Javascript的编译目标
正如许多开发者一样,我也为Asm.js的前景而感到兴奋不已.最近的新闻——Asm.js正 在被Firefox支持——引起了我的兴趣.同样感兴趣的还有Mozilla和Epic声明(mirror)他们已经 ...
- 物联网3D,物业基础设施3D运维,使用webgl(three.js)与物联网设备结合案例。搭建智慧楼宇,智慧园区,3D园区、3D物业设施,3D楼宇管理系统——第八课
写在前面的废话: 很久没有更新文章了,这段时间一直忙于项目落地,虽然很忙,但是感觉没有总结,没有提炼的日子,总是让人感觉飘飘忽忽的. 所幸放下一些事,抽出一些时间,把近期的项目做一些整理与记录.也算是 ...
- 【Machine Learning】机器学习及其基础概念简介
机器学习及其基础概念简介 作者:白宁超 2016年12月23日21:24:51 摘要:随着机器学习和深度学习的热潮,各种图书层出不穷.然而多数是基础理论知识介绍,缺乏实现的深入理解.本系列文章是作者结 ...
- js引出函数概念的案例
js引出函数概念的案例 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8&q ...
- 转:HTML5标准与性能之四:asm.js
HTML5标准与性能之四:asm.js Cong Liu (Intel) 于 星期五, 24/05/2013 - 01:13 提交 之前的几篇文章分别介绍了WebWorkers.Typed Array ...
- js的基本概念详解
来自<javascript高级程序设计 第三版:作者Nicholas C. Zakas>的学习笔记(三) 如果你刚学js,想快速了解到js的基本概念,以下将会是一篇不错的引导文章: 语法 ...
- Raphael Js矢量库API简介:
Raphael Js矢量库API简介:Raphael Javascript 是一个 Javascript的矢量库. 2010年6月15日,著名的JavaScript库ExtJS与触摸屏代码库项目jQT ...
随机推荐
- Tensorflow实现学习率衰减
Tensorflow实现学习率衰减 觉得有用的话,欢迎一起讨论相互学习~Follow Me 参考文献 Deeplearning AI Andrew Ng Tensorflow1.2 API 学习率衰减 ...
- LightOJ 1065 - Number Sequence 矩阵快速幂水题
http://www.lightoj.com/volume_showproblem.php?problem=1065 题意:给出递推式f(0) = a, f(1) = b, f(n) = f(n - ...
- Anaconda更换版本方式
Conda的环境管理 Conda的环境管理功能允许我们同时安装若干不同版本的Python,并能自由切换.假设我们需要安装Python 3.6,此时,我们需要做的操作如下: # 创建一个名为python ...
- H5多媒体
Video <video width="500px" controls="controls"> <source src="test. ...
- (值类型引用类型)和null的关系
1.null null表示变量没有指向任何对象. 2.值类型 包括 bool.结构体.枚举.int.double.float等等 .在.NET中值类型都继承自ValueType. 3. 引 ...
- 【洛谷 P4166】 [SCOI2007]最大土地面积(凸包,旋转卡壳)
题目链接 又调了我两个多小时巨亏 直接\(O(n^4)\)枚举4个点显然不行. 数据范围提示我们需要一个\(O(n^2)\)的算法. 于是\(O(n^2)\)枚举对角线,然后在这两个点两边各找一个点使 ...
- 【leetcode 简单】第四十八题 旋转数组
给定一个数组,将数组中的元素向右移动 k 个位置,其中 k 是非负数. 示例 1: 输入: [1,2,3,4,5,6,7] 和 k = 3 输出: [5,6,7,1,2,3,4] 解释: 向右旋转 1 ...
- python作业购物车(第二周)
一.作业需求: 1.启动程序后,输入用户名密码后,如果是第一次登录,让用户输入工资,然后打印商品列表 2.允许用户根据商品编号购买商品 3.用户选择商品后,检测余额是否够,够就直接扣款,不够就提醒 4 ...
- 1-spring xml 和 注解 解析过程
spring mvc 入口 DispatcherServlet,类关系图如下所示 DispatcherServlet 就是一个 Servlet,那Servlet 的初始化方法 init()在哪里,通过 ...
- 【读书笔记::深入理解linux内核】内存寻址
我对linux高端内存的错误理解都是从这篇文章得来的,这篇文章里讲的 物理地址 = 逻辑地址 – 0xC0000000:这是内核地址空间的地址转换关系. 这句话瞬间让我惊呆了,根据我的CPU的知识,开 ...