随笔- 443  文章- 77  评论- 996  阅读- 105万 

随笔分类 -  前端性能精进

前端性能精进(七)——构建
摘要:前端构建是指通过工具自动化地处理那些繁琐、重复而有意义的任务。 这些任务包括语言编译、文件压缩、模块打包、图像优化、单元测试等一切需要对源码进行处理的工作。 在将这类任务交给工具后,开发人员被解放了生产力,得以集中精力去编写代码业务,提高工作效率。 构建工具从早期基于流的 gulp,再到静态模块打包 阅读全文
posted @ 2023-04-03 06:58 咖啡机(K.F.J) 阅读(1747) 评论(2) 推荐(7) 编辑
前端性能精进(六)——网络
摘要:网络也是前端性能优化的重要一环,网页上的资源都要经过网络来传输。 优化网络性能除了缓存和压缩之外,还有就是协议和 CDN。 HTTP 协议已经历了多个版本,每个版本的出现其实就是为了解决已知的性能问题。 目前市面上,有许多成熟的商业 CDN 服务,采用这些服务的网页,在性能提升上也很可观。 2023 阅读全文
posted @ 2023-03-27 07:35 咖啡机(K.F.J) 阅读(320) 评论(0) 推荐(2) 编辑
前端性能精进之浏览器(五)——JavaScript
摘要:JavaScript 是一种通过解释执行的高级编程语言,同时也是一门动态、弱类型的直译脚本语言,适合面向对象(基于原型)和函数式的编程风格。 直译语言可以直接在解释器中运行,而与直译语言相对应的编译语言(例如 C++),要先将代码编译为机器码,然后才能运行。 不过直译语言有一个弱点,就是如果有一条不 阅读全文
posted @ 2023-03-20 08:10 咖啡机(K.F.J) 阅读(395) 评论(0) 推荐(3) 编辑
前端性能精进之浏览器(四)——呈现
摘要:现如今,在呈现一个页面时,在浏览器中会打开众多进程,包括浏览器、渲染、插件、GPU、网络等进程。 浏览器进程负责存储、界面、下载等管理。在渲染进程中,运行着熟知的主线程、合成线程、JavaScript 解释器、排版引擎等。 而呈现一个页面大致可分为 4 个步骤: 浏览器进程处理用户在地址栏的输入,然 阅读全文
posted @ 2023-03-13 08:11 咖啡机(K.F.J) 阅读(380) 评论(1) 推荐(1) 编辑
前端性能精进之浏览器(三)——图像
摘要:HTTP Archive 在 2022 年关于多媒体的报告中指出,目前大概有 99.9% 的网站或多或少都会包含点图像。 并且高达 70% 的移动页面和 80% 的桌面页面的 LCP 指标会受图像的影响。 2023-11-27 据统计,合理使用图像能减少 20% 的带宽。 通过这些数据可知,图像在网 阅读全文
posted @ 2023-03-06 08:11 咖啡机(K.F.J) 阅读(379) 评论(0) 推荐(3) 编辑
前端性能精进之优化方法论(二)——分析
摘要:在上一节中曾提到过两种性能监控:SYN 和 RUM,那么对应的也有两种分析:数据分析和实验室分析。 数据分析会通过采集上来的性能信息来剖析和定位可能存在的各种问题。 实验室分析会通过某个线上或本地的测试工具对页面进行单点测试,得出性能分析报告。 本文会对前者介绍一些分析实践,后者会介绍一些比较有名的 阅读全文
posted @ 2023-02-27 08:25 咖啡机(K.F.J) 阅读(390) 评论(0) 推荐(1) 编辑
前端性能精进之优化方法论(一)——测量
摘要:性能优化的重要性不言而喻,Google 的研究表明,当网站达到核心 Web 指标(Core Web Vitals)阈值时,用户放弃加载网页的可能性会降低 24%。 如何科学地定位到网页的性能瓶颈,就需要找到一个合理的方式来测量和监控页面的性能,确定优化的方向。 前端的性能监控分为 2 种: 第一种是 阅读全文
posted @ 2023-02-20 09:47 咖啡机(K.F.J) 阅读(868) 评论(0) 推荐(2) 编辑

点击右上角即可分享
微信分享提示