日本电子维修技术 浏览器可以有多快



React.js 以高效的 UI 渲染著称,其中一个很重要的原因是它维护了一个虚拟 DOM,用户可以直接在虚拟 DOM 上进行操作,React.js 用 diff 算法得出需要对浏览器 DOM 进行的最小操作,这样就避免了手动大量修改 DOM 的时候造成的性能损失。等等,明明是在中间加了一层,为什么结果反而变快了呢?React.js 的核心思想是认为 DOM 操作是缓慢的,因此可以需要最小化 DOM 操作,以换取整体的性能提升。DOM 操作慢是有目共睹的,而其他 JavaScript 脚本的运行速度就一定快吗?

在 V8 出世之前,这个问题的答案是否定的。Google 早年商业模式建立在 Web 的基础上,当它在浏览器中写出 Gmail 这样一个无比复杂的 Web app 的时候,它不可能意识不到浏览器难以忍受的性能,而这主要是因为 JavaScript 的执行速度太慢。2008 年 9 月,Google 决定自己造一个 JavaScript 引擎来改变这一现状—— V8。当搭载着 V8 的 Chrome 浏览器出现在市场上的时候,它的速度远远甩开了当时的所有浏览器。浏览器性能的空前提升让复杂的 Web app 成为了可能。

近七年过去,浏览器的性能随着 CPU 的性能不断上升,但再也没有获得过 2008 年那样突破性的增长。V8 到底用了什么样的技术让 JavaScript 的性能获得了如此大的提升呢?

V8 的优化

要说如何让 JavaScript 变快,就应该先来谈谈它为什么会慢。众所周知 JavaScript 是 Brendan Eich 这个家伙用了一周多的时间开发出来的,相比现如今如日中天的 Swift 是 Apple 的一个团队四年工作的成果,你首先可能就不应该对它有过高的期待。事实上,Brendan Eich 并未意识到自己要开发的是这样一个体量的语言。为了程序员编写时的灵活,他将 JavaScript 设计成为弱类型的语言,并且在运行时可以对对象的属性增添删改。难倒一大群人的 C++ 中的继承、多态,还有什么模板、虚函数、动态绑定这些概念在 JavaScript 中完全不存在了。那这些工作谁来做了呢?自然就只有 JavaScript 引擎。由于不知道变量类型,它在运行时做着大量的类型推导工作。在 Parser 完成工作建出一棵抽象语法树(AST)的时候,引擎会把这棵 AST 翻译成字节码(bytecode)交给字节码解释器去执行。其中最拖慢性能的一步就是解释器执行字节码的阶段。回望当时,大家不知道解释器性能低下吗?其实不是,这样设计的原因是当时的人们普遍认为 JavaScript 作为一种给设计师开发的语言(前端工程师有没有心里一凉?),并不需要太高的性能,这样做符合成本,也满足需求。

V8 做的工作主要就是去掉了这个拖慢引擎速度的部分,它从 AST 直接生成了 CPU 可执行的机器码。这种即时编译的技术被称为 JIT (Just in time)。如果你足够好奇,一个自然的想法就是,这到底是怎么办到的?
cV43RG9WdrZHBDFJ
我们举一个例子来说:

function Foo(x, y) {
    this.x = x;
    this.y = y;
}

var foo = new Foo(7, 8);
var bar = new Foo(8, 7);
foo.z = 9;


属性读取

首先是数据结构。你打算如何索引对象的属性?我们已经太熟悉 JSON 中 key: value 的数据结构,但在内存中可以以 key 来索引吗?value 在内存中的位置可以确定吗?当然可以,只要对每个对象维护一个表,里面存着每个 key 对应的 value 在内存中的位置就可以了不是吗?

这里的陷阱在于,你需要对每一个对象都维护这样一个表。为什么?我们来看看 C 语言是怎么做的。

struct Foo {
    int x, y;
};

struct Foo foo, bar;

foo.x = 7;
foo.y = 8;
bar.x = 8;
bar.y = 7;

// Cant' set foo.z


仔细想想大学时候的教材,foo.x 和 foo.y 的地址是可以直接算出来的呀。这是因为成员 x 和 y 的类型是确定的,JavaScript 里完全可以 foo.x = "Hello" ,而 C 语言就没办法这样做了。

V8 不想给每个对象都维护一个这样的表。它也想让 JavaScript 拥有 C/C++ 直接用偏移就读出属性的特性。所以它的解决思路就是让动态类型静态化。V8 实现了一个叫做隐藏类(Hidden Class)的特性,即给每个对象分配一个隐藏类。对于 foo 对象,它生成一个类似于这样的类:

class Foo {
    int x, y;
}


当新建一个 bar 对象的时候,它的 x 和 y 属性恰好都是 int 类型,那么它和 foo 对象就共享了这个隐藏类。把类型确定以后,读取属性就只是在内存中增加一个偏移的事情了。而当 foo 新建了 z 属性的时候,V8 发现原来的类不能用了,于是就会给 foo 新建一个隐藏类。修改属性类型也是类似。

Inline caching

由上可知,当访问一个对象的属性的时候,V8 首先要做的就是确定对象当前的隐藏类。但每次这样做的开销也很大,那很容易想到的另一个计算机中常用的解决方案,就是缓存。在第一次访问给定对象属性的时候,V8 将假设所有同一部分代码的其他对象也都使用了这个对象的隐藏类,于是会告诉其他对象直接使用这个类的信息。在访问其他对象的时候,如果校验正确,那么只需要一条指令就可以得到所需的属性,如果失败,V8 就会自动取消刚才的优化。上面这段话用代码来表述就是:

foo.x

# ebx = the foo object
cmp [ebx,<hidden class offset>],<cached hidden class>
jne <inline cache miss>
mov eax,[ebx, <cached x offset>]


这极大提升了 V8 引擎的速度。

还能更快吗?

随着 Intel 宣布 Tick-Tock 模型的延缓,CPU 处理速度不再能像之前一样稳步增长了,那么浏览器还能继续变快吗?V8 的优化是浏览器性能的终点吗?

JavaScript 的问题在于错误地假设前端工程师都是水平不高的编程人员(如果不是,你应该不会读到这里),岂图让程序员写得舒服而让计算机执行得痛苦。在现代浏览器引擎已经优化到这个地步的时候,我们不禁想问:为什么一定是 JavaScript ?前端工程师是不是可以让出一步,让自己多做一点点事情,而让引擎得以更高效地优化性能?JavaScript 成为事实上的浏览器脚本标准有历史原因,但这不能是我们停止进步的借口。

当 Web Assembly 正式宣布的时候,我才确定了不仅仅是我一个名不见经传的小程序员有这样的想法,那些世界上最顶级的头脑已经开始行动了。浏览器在大量需求的驱动下正在朝着一个高性能的方向前进,浏览器究竟可以有多快,2015 可能是这条路上另一个转折点。

电路 电子 维修 求创维42c08RD电路图 评论 电视的图纸很少见 评论 电视的图纸很少见 评论 创维的图纸你要说 版号,不然无能为力 评论 板号5800-p42ALM-0050 168P-P42CLM-01 电路 电子 维修 我现在把定影部分拆出来了。想换下滚,因为卡纸。但是我发现灯管挡住了。拆不了。不会拆。论坛里的高手拆解过吗? 评论 认真看,认真瞧。果然有收
 ·日本留学生活 求个大阪合租
·日本留学生活 自家房招租求
·日本留学生活 东京地区出9成新lv钱包
·日本育儿教育 孩子从国内过来如何学习日语
·日本育儿教育 明年四月横滨招月嫂
·日本育儿教育 请问咋让娃突破识字关?感谢分享中文共读和学习经验的妈妈
 ·中文新闻 东区明星迈克尔·格列柯,53 岁,将在第一次出生两年后第二次
·中文新闻 《爱情岛》明星卡米拉·瑟洛和杰米·朱维特在透露即将迎来第三

维修经验

CPUcpu-z 1.77版低调发布

日本维修技术更新: New benchmark “submit and compare” feature New clocks dialog reporting all system’s clock speeds in real-time Preliminary support for Intel Kaby Lake AMD Bristol Ridge processors 主要是增加了支持I、A两个新架构的 ...

维修经验

CPU这几天经常开机黑屏,热重启后又正常

日本维修技术这几天经常开机黑屏,热重启后又正常,今天热重启也不管用了。折腾半天总算点亮,显示超频失败,以前出这个画面我是不理它的,直接重启就能正常进系统了,今天不敢托大,因为 ...

维修经验

CPU超频求助!关于华擎H170和6700K

日本维修技术问题见楼主的show贴 https://www.chiphell.com/thread-1634895-1-1.html 这次华擎的H170 Hyper最大的特色应该是自带时钟发生器可以自由超外频 可是楼主好久没有折腾超频了。。。 两图中除了CPU外频 以 ...

维修经验

CPU液态金属会侵蚀cpu核心吗?

日本维修技术前阵子看到有人说,液态金属时间长了会侵蚀cpu铜盖,那么问题来了,这货会不会侵蚀核心呢? 评论 这玩意儿好像只对铝起反应 评论 不是说,cpu的盖子是铜的吗。。。 评论 不会,核 ...

维修经验

CPUm6i究竟支不支持e3 1231v3

日本维修技术官网上看支持列表没写有e3 1231v3,装机帖又有人晒,百度也没个明确答案,那究竟能不能点亮?有在用的chher说一下么 评论 升级最新bios肯定可以支持 评论 我的p67evo官网上也没说支持12 ...

维修经验

CPU华擎 HYPER 妖板 正确玩法

日本维修技术600元的 B150,10相供电,释放洪荒之力 注意必须官网 Beta 区的 BIOS 有 AVX 的 CPU 可能会掉缓存 启动时按 X 键激活 SKY OC,重启后进入 BIOS 160924164727.jpg (95.63 KB, 下载次数: 1) 2016-9-24 17:47 上传 ...

维修经验

CPUE5 2686 V3和i7 6800K如何选择

日本维修技术默认用,不超频,两者功耗是一模一样的 E5 2686 V3:2.0主频,3.5睿频, 18核心36线程 ,45M L3 咸鱼大约2500~3000元 i7 6800K : 3.5主频,3.8睿频 ,6核心12线程 ,盒装3000元 评论 性能应该是26 ...

维修经验

CPUHD530硬解4K能力还是有点弱呀!

日本维修技术播放器用PotPlay 64bit,各种优化后,跑4K @120Hz视频只能到70帧左右的速度,勉强能用! 显示器用的4K的优派VP2780 未标题-1.jpg (211.97 KB, 下载次数: 0) 2016-9-26 21:29 上传 评论 这个估计你没优化 ...

维修经验

CPU6900k 1.25V到4.2体质怎么样

日本维修技术如图,体质怎么样,ring是35,没敢试了,都说ring高了毁硬件 评论 不错的U,但不算雕,上4.4就大雕了,这电压上4.5的目前没见有人发图 评论 谢谢前辈告知 评论 我这个用1.2V超的4.2,R ...

维修经验

CPUI3 6100 华擎B150M pro4超4.5g测试。

日本维修技术看看论坛没多少i3 6100的帖子,就转下自己发的show贴里面的数据,给大家参考下。家里还有当年的神U i3 540 oc 4.5G在给老妈用。 不知道数据上正常吗?有6100的朋友可以告诉下,另外是不有 ...

维修经验

CPU7系u会兼容100系主板吗?

日本维修技术RT,听说要推200系板,100系还能用吗以后。。 评论 兼容的 评论 感谢!以后换u就行了,目前消息200系板会有新的特性吗? 评论 24条PCI-E 3.0通道、支持Intel Optane混合存储技术、十个USB 3 ...

维修经验

CPU有心入5820k了,求教下温度问题

日本维修技术一直徘徊在6700k和5820k之间,6700k现在这德行直接把我推向了5820k啊,从2600k升级上来,三大件都要换,现在唯一疑惑的是IB-E ex这种顶级风冷能不能压住4.5g的5820呢?毕竟刚刚买一个多月。 ...

维修经验

CPU6600&amp;6600K才100的差价

日本维修技术太少了吧。。。 6600.JPG (106.91 KB, 下载次数: 0) 2016-10-1 10:30 上传 评论 毕竟只是i5而已…… 评论 上z170 6600也能超,等于没区别,差价能有100已经不错了 评论 然后又见不超频人士推荐超频 ...