这 5 年 web 前端领域到底发生了什么，我怎么感觉性能变差了？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 2402 天前的主题，其中的信息可能已经有所发展或是发生改变。

5 年前那个时候，flash 还没死绝，各个浏览器核心还在持续优化，H5 还没有形成优势地位。5 年过去了，flash 基本死绝，H5 称霸业界，浏览器发展了 5 年，可我觉得我的电脑打开页面越来越慢了，按理说甩开了 flash 的历史包袱，全新的 ES6，ES7 标准，加上 5 年时间对 js 引擎的优化，网页应该打开的更快才对，到底为什么，这 5 年 web 页面的复杂度在不知不觉中发生了变化了吗？

flash

Web

浏览器

ES7

69 条回复 • 2020-08-09 19:20:41 +08:00

p64381

2017-09-21 22:05:35 +08:00 via Android

你的感觉没错，最快的时候是在刚出 chrome 那几天

Rubicker666

2017-09-21 22:10:28 +08:00 via Android

明显页面复杂度提升可不止一个档次

wzw

2017-09-21 22:12:10 +08:00 via Android

说得好，页面越来越复杂，难回简洁的时代了。

SuperMild

2017-09-21 22:12:15 +08:00

由于前端功能越来越完善，以前迫不得已需要在服务器处理的东西，现在几乎都能转到前端来做了，消耗的客户端的性能，但服务器减负啊。

abcbuzhiming

2017-09-21 22:46:17 +08:00

@Rubicker666
@wzw
举个例子吧，复杂在何处

saran

2017-09-21 22:49:47 +08:00

为什么会这样呐，完全就是 ng\raect\vue 之些带歪了节奏，明明一个脚本，搞成了一个巨大的世界，然而实际上还是只干了脚本那点事。

Quaintjade

2017-09-21 22:56:08 +08:00 via Android

现在越来越多的东西都让浏览器处理了(此处该 @海盗湾)
还有就是虽然有优化，但不同浏览器优化不同，比如 chrome 的 for 嵌套特别快，另一些 function 则比较慢； Firefox 可能相反。

OctoCat

2017-09-21 23:00:33 +08:00

前端轮子越来越多了，帮派也很多，喜欢撕逼搞事。编程界的演艺圈。

a87150

2017-09-21 23:02:17 +08:00 via Android

乱七八糟的特效太多。

remon

2017-09-21 23:08:00 +08:00

@abcbuzhiming #5 简单来说就是：以前后端渲染模式，访问一个页面---浏览器发出请求，服务器后台读取数据，渲染模板，浏览器拿到 HTML 开始渲染，请求图片等资源，用户看到一个完整网页；
现在浏览器渲染模式，访问一个页面---浏览器发出请求，从 CDN 或服务器得到静态页面（此页面只包含极少部分页面内容），浏览器开始渲染，看到部分静态内容，请求静态资源，解析 js 脚本，发出请求，服务器响应请求，返回数据，js 拿到数据，拼装内容，浏览器渲染，用户看到完整网页

roychan

2017-09-21 23:08:26 +08:00

都是戏。

rogwan

2017-09-21 23:11:07 +08:00 via Android

还有各种第三方 API 加载 js，拼装，渲染，不慢才怪呀

chinvo

2017-09-21 23:42:54 +08:00

因为 “ H5 ” 这个 PM 们造出来的假概念

至今不能理解 H5 到底是什么

仔细想想，大概 H5 约等于大量冗余 JS 代码+大量 JS 动画+大量冗余 CSS 代码+大量 CSS 动画+大量冗余 HTML 内容+大量垃圾第三方资源

不慢才怪

duola

2017-09-21 23:46:00 +08:00

你的电脑换了没有。

dixeran

2017-09-21 23:46:11 +08:00 via Android

服务器减少的任务丢给浏览器了

lightening

2017-09-21 23:54:32 +08:00

@abcbuzhiming 比如各种页面内的交互。

SilentDepth

2017-09-22 01:05:22 +08:00 via iPad

@saran 哪点事？

tonghuashuai

2017-09-22 01:05:33 +08:00 via iPhone

因为页面承载了过多的前端繁荣。

prolic

2017-09-22 01:25:29 +08:00

感觉离完全的前后端分离也不远了，nginx 做路由调静态 html+js，后台只提供 RESTful 接口

wangjie

2017-09-22 01:26:31 +08:00 via iPhone

同想问你电脑换了没

t6attack

2017-09-22 02:08:02 +08:00

javascript 变成浏览器的汇编了。

markocen

2017-09-22 04:13:27 +08:00 via Android

你用的是 5 年前的电脑吗

carlclone

2017-09-22 04:42:59 +08:00 via Android

v2 也那么多傻逼帖了吗

ChefIsAwesome

2017-09-22 08:18:45 +08:00

张嘴就来，说慢的倒是举个例子说说哪家网站你打开慢了？五年前你家宽带多少兆，现在多少兆，脚本体积的增长赶得上宽带的增长速度？就拿淘宝那首页讲，那么多图，首页初次加载也就只有 600k 左右，还不是 js 做的懒加载的功劳。换五年前你开个图片都费劲吧。

fuxkcsdn

2017-09-22 08:55:54 +08:00 via iPhone

@ChefIsAwesome 5 年前淘宝就使用上懒加载技术了

maddot

2017-09-22 09:13:35 +08:00

简历驱动编程
明明 jquery 可以搞定，但为了简历上写上各种框架项目经验，就上框架了
这些框架也创造出了更多的职位，是有利于我们这个行业的.....

dsg005

2017-09-22 09:15:17 +08:00

10 年前的一些 flash 动画效果，至今 html5 还实现不了，就算模仿出来了，一眼就能看出不是 flash

XueSeason

2017-09-22 09:37:24 +08:00

5 年前 iPhone 4s 运行 iOS 6 也很快啊，5 年前我老家 10 年前的电脑还能带动 LOL。

fulvaz

2017-09-22 09:38:19 +08:00

是啊.

不然你以为为啥前端这么贵了.

DT27

2017-09-22 09:46:16 +08:00

前端不安分，动不动就造新轮子。。。

whypool

2017-09-22 09:46:19 +08:00

前端承担了 6 成以上的数据逻辑，交互逻辑，加上各种框架自己的事件循环，所以慢是浏览器处理这些东西要花时间

ruimz

2017-09-22 09:58:33 +08:00 via Android

前端换了电脑而你没有😂😂

https://zhuanlan.zhihu.com/p/27827321

abcbuzhiming

2017-09-22 11:40:05 +08:00

@wangjie
@duola
@wangjie
没换啊，就是因为没换所以才有比较啊

abcbuzhiming

2017-09-22 11:40:16 +08:00

@carlclone 你才傻逼

abcbuzhiming

2017-09-22 11:43:06 +08:00

@ChefIsAwesome 什么叫张嘴就来，你自己没体验吧，就拿淘宝来说，现在的淘宝首页打开的时候比 5 年前费劲多了，5 年前的淘宝首页打开无论速度还是 CPU 占有率都没现在这么高，现在我的宽带是 5 年前的 25 倍，CPU 停留在 I5 3570，可是打开淘宝首页不仅明显感觉页面载入变慢了，而且 CPU 转的茫茫快

Sapp

2017-09-22 15:30:53 +08:00

@abcbuzhiming 刚试了试，我的淘宝是秒进去的，就是图片出来需要个 1-2 秒才能全出来。几年前淘宝什么样我已经忘了，但是我估摸着能比淘宝这个速度快，也就百度首页那种了。

abcbuzhiming

2017-09-22 15:36:30 +08:00

@Sapp 你有没有注意这个过程中你的 CPU 占用率，尤其是此时如果你往下滚动一下页面会发现你的 CPU 占用率飙升，这个可是 5 年前绝对没有的现象

Tunar

2017-09-22 15:37:50 +08:00 via Android

忙着吵架😓

Sapp

2017-09-22 15:41:34 +08:00

@abcbuzhiming 我又去试了一下，cpu 除了刚进去 cpu 升高了，后面一直保持着稳稳地没动，几秒之后就跌回来了，使用率从 5% 升到了 10%，还有 90% 多闲置着。

EchoChan

2017-09-22 16:00:04 +08:00 via iPhone

麻烦把性能定义清楚。

abcbuzhiming

2017-09-22 16:02:13 +08:00

@Sapp 对啊，就是刚进去的时候，这个现象在 5 年前是没有的，载入页面 DOM 树时浏览器对 CPU 的占用飙升，这种现象在 5 年前只出现在无节制的在页面上的堆 flash 的网页。而且 5 年前的淘宝是没有这种载入时 CPU 占用飙升的情况的，而且淘宝还算比较好的了，有的网站居然能把 I5 飚到 80%以上，这在 5 年前是没有的

abcbuzhiming

2017-09-22 16:05:12 +08:00

@EchoChan 从按下回车，浏览器下载页面并最终完成页面渲染的这段时间，CPU 的占用率比 5 年前高出了许多，渲染的平均时间慢于 5 年前，而这 5 年时间 Html5 和 js 的变化并没有太大，唯一的变化就是少了吃资源大户 flash，所以我觉得这很不合理