也许，DOM 不是答案

有一个词“移动网站”（web），指的是用于移动浏览的网站，但并不存在。

当人们提到“移动互联网”时，他们指的是另一件事：移动应用程序。

一、Web 应用与应用

与移动应用相比，网站具有一些明显的优势。

但现实是什么？

(1）体验很差，手机app的操作远比网站流畅。

(2）行业不支持。所有公司的移动端开发重点是游戏服务器是cs架构用来网站使用会怎么样，几乎都是原生应用。

(3）用户不在乎。大多数用户选择使用移动应用而不是网站。

如果有一天，web 一个应用会成为主流，而且必须有一个前提，它的性能可以赶上这个应用。

二、为什么网络应用会出现性能瓶颈？

@ >

Web应用输给应用的地方不是界面（UI），而是操作性能。主要是()和()这两个方面，会出现jank，用户会感觉明显时滞，有时慢得让人难以忍受。

Web 应用的性能瓶颈主要有以下几个原因。

(1）Web是基于DOM的，而DOM是很慢的。浏览器打开网页时，需要解析文档，生成内存中的DOM结构。如果遇到复杂的文档，这个过程很慢，试想一下，如果网页上有几万甚至几十个文档上千个形状（无论是图片还是CSS），生成DOM需要多长时间？更不用说与其中一个交互了他们。

(2）DOM变慢了。所有的DOM操作都是同步的，会阻塞浏览器。操作DOM的时候，必须等上一个操作结束后才能进行下一个操作。只要一次操作卡住，整个网页会暂时失去响应，浏览器重绘网页的频率是60FPS（即16毫秒/帧），DOM操作不能在16毫秒内完成，所以出现跳帧. 不流畅和不连贯的用户体验源于此。

(3） 网页是单线程的。现在的浏览器对每个网页只使用一个线程。所有的工作都在这个线程上完成，包括布局、渲染、执行、图像解码等。怎么可能呢？不慢吗？

(4）网页没有硬件加速。网页由CPU处理，GPU不用于图形加速。

这些原因对于PC来说并不严重，但是手机的硬件资源比较有限，用户交互比较频繁。与app相比，结果完全逊色。

三、解决方案

本来是一个手机应用，最近开始部署网页版，遇到了上面的问题：网页版的体验不好。

上周，他们在网站上公布了解决方案，结果引起了轰动，因为这是一个前所未有的解决方案：

—-他们没有使用DO M，而是使用了整个网站的输出！

你可以用手机打开，体验一下，看看和app有什么不同。如果您没有帐户，可以直接在此处或此处打开。

这个方案的出发点是：如果网页一个一个地变化，用户就相当于和图片进行交互，从而绕过了DOM，减少了操作时滞。此外，它可以进行硬件加速，从而提高性能。具体技术细节请参考原文。改造是基于React框架实现的，专门开发了React-库，已经开源。

这个方案引起了很多争议（这里和这里），主要是因为它只是一个位图，没有语义。如果要在其上实现UI，就相当于重新发明了HTML语言已有的东西。 ，比如如何实现超链接，如何实现CSS效果等等。一些最简单的事情变得麻烦了，因为它不是()，哪里的文字断了，你得自己计算，用户不能选择文字。另外游戏服务器是cs架构用来网站使用会怎么样，如何让搜索引擎检索网页也不是很容易解决。

但无论哪种方式，这都是值得的尝试。

四、前面的路

James Long 写了一篇关于 Web 的评论。这篇文章的灵感来自那篇文章。

在本文中，James Long 对网络应用的未来做了一些我认为值得分享的预测。

(1）多线程浏览器。每个网页应该由多个线程处理，主线程只负责布局和渲染，应该在16毫秒内完成，由线程执行，这样就有了不会有阻塞，正在开发的伺服就是这样一个项目。

(2）DOM的异步操作。DOM的操作不再是同步的，而是触发后，post监听Event Loop机制。

(3）非DOM解决方案。浏览器不再将网页处理成DOM结构，而是处理成其他结构。React的DOM解决方案就是这种类型的解决方案。，还有更激进的解决方案，比如替换带有数据库的 DOM。

（完）