首页
AI Coding
NEW
沸点
课程
直播
活动
AI刷题
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
性能优化
订阅
sealzrt
更多收藏集
微信扫码分享
微信
新浪微博
QQ
13篇文章 · 0订阅
网站性能优化实战——从12.67s到1.06s的故事
——本文是对之前同名文章的修正,将所有webpack3的内容更新为webpack4,以及加入了笔者近期在公司工作中学习到的自动化思想,对文章内容作了进一步提升。 作为互联网项目,最重要的便是用户体验。在举国“互联网+”的热潮中,用户至上也已经被大多数企业所接收,特别是在如今移动…
关键渲染路径优化
天下武功唯快不破,页面加载速度与用户体验息息相关,也关乎企业收益:最知名的当属 Amazon 加载速度每增加一秒一年少赚 16 亿美刀的例子(还是 N 年前的统计),真是应验那句话: 时间 == 金钱! 对此 Google Developer 专门有一篇文章用于阐述页面载入速度…
时间切片(Time Slicing)
上周我在FDConf的分享《让你的网页更丝滑》中提到了“时间切片”,由于时间关系当时并没有对时间切片展开更细致的讨论。所以回来后就想着补一篇文章针对“时间切片”展开详细的讨论。 从用户的输入,再到显示器在视觉上给用户的输出,这一过程如果超过100ms,那么用户会察觉到网页的卡顿…
(译)2019年前端性能优化清单 — 上篇
写在译前:首先介绍一下我自己,一个跨行业的、完全非科班生的文科单身狗。因为生计,走上了自学前端的荆棘之路,然后经过一路的摸爬打滚终于算是入了前端的这个门,自己也知道在前端这条道路上还有很长的路要走。平常生活中喜欢跑步,欢迎有同样爱好的大佬一起交流切磋。 这篇译文是在掘金Limi…
「前端进阶」高性能渲染十万条数据(时间分片)
在实际工作中,我们很少会遇到一次性需要向页面中插入大量数据的情况,但是为了丰富我们的知识体系,我们有必要了解并清楚当遇到大量数据时,如何才能在不卡主页面的情况下渲染数据,以及其中背后的原理。 我们对十万条记录进行循环操作,JS的运行时间为187ms,还是蛮快的,但是最终渲染完成…
2018 前端性能优化清单
推荐大家时间充裕的话可以自己阅读英文原文,此文是根据掘金翻译的四篇文章 + 其他的翻译文章 + 自己翻译修改得出的。因为翻译大家懂得,会有一些错误的地方,欢迎大家指出,本人不保证翻译没有错误,但已经尽力去翻译了,所以欢迎大家直接阅读英文原文!!欢迎大家直接阅读英文原文!!欢迎大…
性能提升80%!详解饿了么H5性能优化秘诀
随着移动互联网的发展,用户对产品的使用体验要求越来越高。H5作为业务的重要载体,在移动端的应用非常广泛,因此H5页面性能是一个非常核心的用户体验指标。 本文结合【饿了么首屏优化实践】为大家介绍页面性能优化的思路。 性能优化的首要基础是数据和指标。没有正确的数据和指标指引,优化思…
浏览器渲染过程与性能优化
大家都知道万维网的应用层使用了HTTP协议,并且用浏览器作为入口访问网络上的资源。用户在使用浏览器访问一个网站时需要先通过HTTP协议向服务器发送请求,之后服务器返回HTML文件与响应信息。这时,浏览器会根据HTML文件来进行解析与渲染(该阶段还包括向服务器请求非内联的CSS文…
关键渲染路径
浏览器将HTML,CSS,JavaScript转换为屏幕上所呈现的实际像素,这期间所经历的一系列步骤,叫做关键渲染路径(Critical Rendering Path)。 图1-1给出了关键渲染路径的具体步骤。如图所示,首先,浏览器获取HTML并开始构建DOM(文档对象模型 -…