性能优化
文章平均质量分 90
夏狗花花
勇于尝试,乐于经历,坦然接受
展开
-
理论篇 | 浏览器缓存机制
这是我参与8月更文挑战的第4天,活动详情查看:8月更文挑战 前言 网络层面的性能优化,使用缓存是一个最直接有效的方案。使用缓存可以减少网络 IO 消耗,提高访问速度,效果显著。因此,认识一下浏览器的缓存机制很有必要。 上图 Network 面板的截图中,我们在 size 列可以看到缓存的获取来源。 浏览器缓存机制有四个方面,它们按请求的优先级依次排列如下: Memory Cache Service Worker Cache HTTP Cache Push Cache Chrome 官方的缓存决原创 2021-08-10 00:04:04 · 123 阅读 · 0 评论 -
理论篇 | 窥探浏览器运行的幕后
前言 上一篇《开篇 | 关于前端性能优化的探索》中提到,性能优化需要围绕着网络请求的过程和浏览器渲染机制去展开。但其中提到的渲染过程仅仅是关键路径渲染的部分,对于回流和重绘、UI渲染和JS引擎互斥的原因尚未明确。为了更好的理解这些,接下来我们深入认识一下浏览器的运作机制。 进程和线程 进程是一个程序运行的实例、是线程的容器 , 操作系统会为进程分配独立的内存(进程之间互相独立); 线程是进程的组成部分,线程共享进程所分配的资源(包括代码段、数据集、堆等); 一个程序至少有一个进程,一个进程至少有一个线程(原创 2021-08-08 04:46:09 · 112 阅读 · 0 评论 -
开篇 | 关于前端性能优化的探索
前言 性能优化是每个前端都绕不过去的课题。说到性能优化,网上一搜一大把《前端性能优化的N条建议》,诸如: 1.减少 HTTP 的请求数;2. 使用 CDN;3. 添加 Expires 头;4. 避免重定向;5. 将 CSS 样式放在页面的上方;6. 将脚本移动到底部;7. 减少 DOM 操作;8. 给图片设置尺寸;9. 减少 DNS 查询;10. 压缩 JavaScript 和 CSS…… 噼里啪啦一大堆,这对于记性不大好的我来说,这种琐碎且毫无章法的1.2.3,太难了啊,能不能先归纳一下?比如说:原创 2021-08-07 22:22:33 · 103 阅读 · 0 评论