想象一下，你刚刚发布了一篇博文，并分享到了社交网络。然后，这篇文章恰巧被大V看中再次分享了出去，立即吸引了数百粉丝的目光，引导他们涌入了你的网站。看到这么多的访客量，以及它们的评论，你内心激动不已。突然之间，你的网站就挂掉了，满屏的数据连接错误……或者假想另一种情境，你一直很努力地创业。突然有一天，一个大V在社交网络表达了对贵公司的喜爱之情，字里行间满满的赞叹。关注这个大V的粉丝心动了，又涌入了你的网站。不幸的是，点击连接后却无法进入你的网站，或者进入后无法注册用户，甚至页面相应超时，无法获取产品的序列号。尽管你在社交网络上对此非常诚恳的表达了歉意，但众多的浏览者都不会再有兴趣。

对于优化移动端的加载速度，我非常坚信适用于所有用户的优化方案，才是最佳方案。做出这一判断的出发点是因为，我们无法预知用户准确的联网方式，可能他使用的并不是手机，但却在使用手机热点的信号，或者使用的是不稳定的无线信号...

在阅读本文之前，你是怎样优化网页的呢？大多数开发者的焦点集中于 JavaScript、图片、服务器配置、文件压缩合并，甚至是 CSS。虽然 HTML 是前端技术的核心之一，但却一直没有得到应有的重视。HTML 的体积日渐臃肿。目前，全球访问量前 100 的网站每个页面大概有 40kB 的大小，类似亚马逊和雅虎这样的网站，甚至每个页面包含了数千行的 HTML 代码。最近，youtube 主页的 HTML 代码量甚至达到了惊人的 3.5K 行（翻译本文时已达到了 4.8K 行）。

Cindy Krum 最近发表了一篇非常值得一读的文章：《9 Things You Need to Know About Google's Mobile-Friendly Update》，强烈建议在阅读本文前理解一下该文的思想。已经准备好了？那我们开始吧。为了在 4 月 21 号前迅速优化为移动端网站，最简单的方法就是牺牲一些性能。但是谷歌曾经多次提醒我们，站点的响应性能是非常重要的搜索权重点，比如 2010关于桌面端 和 2013 关于移动端 的这两篇文章。在本文中，我将会讲述一下最佳实践方案，希望你在创建或重构设计时牢记这些经验。此外，建议你精读谷歌关于移动友好型站点的指导文档。

嗨，各位，又到了周末总结时间！得益于大量的 Grunt 和 Gulp 插件，我们可以轻松实现网站数据的可视化，虽然深入理解这些工具还比较困难，但分门别类的将它们列出来，也是很有帮助的。

现在，Web App 日益重视用户的交互体验，了解性能优化的方式则可以有效提高用户体验。阅读和实践下面的性能优化技巧，可以帮你改善应用的流畅度、渲染时间和其他方面的性能表现。对 Web App 进行性能优化是一份冗杂沉重的工作，这不仅是因为构建一个 Web App 需要前后端协作，而且需要多方面的技术栈：数据库、后端、前端，需要运行在多种平台：iOS，安卓，Chrome，Firefox，Edge。这太复杂了！不过，还是有一些历经实践的通用方式可以用来优化 Web App 的性能。在接下来的小节中，我们将逐步介绍相关的细节。