标签 : 前端性能优化共 9 篇文章
距离上一篇文章发布已有四个月了，是时候写几篇文章给博客除草了。上一次我介绍了我如何迁移、重构了我的博客的架构，这次我想来谈谈我在重构中优化和打磨访客体验时解决的一个问题。我的博客优化之旅 图片 lazyload ... 在咕咕了一整年、只发布了三篇文章（其中两篇还是译文）之后，我决定还是稍微花一点时间好好折腾一下自己的博客，以 React 作为抓手，通过 Next.js 和 Hexo 深度共建，对标 Gatsby，打通静态 HTML 与用户交互之间的垂直领域屏障，实现多维矩阵闭环，为个人博客赋能（咳咳咳），然后水出 2022 年第一篇文章（逃） 两个多月以前，我写了一篇文章 介绍我是如何优化我的博客的，但是我对于博客的白屏时间仍然不满意。过去一个月我在博客上进行了一系列优化实践，终于成功将博客的白屏时间减少了将近 50%，这篇文章就来记录优化的过程和方案。 哪个男孩不想拥有一个速度非常快的博客 之前我也写过少许 关于 Web 性能优化的文章，但是却从未介绍过自己的博客是如何优化的。这次我来水篇文章，罗列一下我的博客的几个零散的优化点。 HTTP/2 诞生于 8 年前 Google 一封 SPDY 协议白皮书。5 年前，RFC7540 和 RFC7541 的发布正式确立了 HTTP/2。5 年过去了，支持 HTTP/2 的浏览器的市场占有率达到了 96.88%，HTTP/3 已经从 QUIC 中诞生，然而回过头来看看国内各大网站，HTTP/2 仍然没有发挥它应该有的作用。不过，HTTP/2 究竟能做什么呢？ 作为第三方社会化评论的鼻祖，Disqus 是目前最受欢迎的评论系统。根据 Wappalyzer 的数据，有超过 10 万的网站正在使用 Disqus。但是笨重的 Disqus 评论对于网站加载来说堪称噩梦 哪个男孩不想拥有一个速度非常快的博客（跑）。之前我写过一些文章介绍如何统计网页的加载性能，在「前端性能监测和回传 Google Analytics」一文中就介绍了 Navigation Timing API 和 Google Analytics 的 Measurement Protoc... lazyload 已经是一个前端性能优化的老生常谈的话题了。让图片不要和其它关键资源争抢带宽和性能早在雅虎军规中就有所涉及。其实任何资源包括媒体资源、DOM 节点、非关键 CSS 和 JS，都可以做 lazyload，不必多谈。不过即使简单地 lazyload 图片，也有很多值得深究的学问。 在 Performance 对象出现以前，来自神秘的东方的前端开发者们采用一种古老的、带着传奇色彩的、但是极为常见的方法来获取一个网站的资源加载用时 
