作者在我司，做了C端活动架构升级，产出的一种骨架屏。姐妹兄弟篇 -《你可能不知道的动态组件玩法🍉》。

• 第一回合： 也是跟上文一样，浏览器去请求服务器资源，不过这次不是通过Last-Modified了，而是用Etag来设置响应头缓存标识。Etag是由服务端生成的，然后浏览器会将Etag与资源缓存 对比完 Last-Modified 与 Etag，我们可以很显然看到，协商缓存每…

今天在做一个小需的时候，忽然看到前辈一句吊炸天的代码 卧槽，竟然同时有async和defer属性，心想着肯定是前辈老司机的什么黑科技，两个一块儿肯定会发生什么神奇化学反应，于是赶紧怀着一颗崇敬的心去翻书翻文档，先复习一下各自的定义。 先看看async和defer各自的定义吧，翻…

在过去一年，越来越多的项目继续或者开始使用React和Redux开发，这是目前前端业内很普遍的一种前端项目解决方案，但是随着开发项目越来越多，越来越多样化时，个人又有了不同的感受和想法。是不是因为已经有了一个比较普遍的，熟悉的项目技术栈，我们就一直完全沿用呢，有没有比他更适合的…

本项目是淘系用户增长团队的一个大中台系统，单页应用，涵盖很多业务功能，运用了很多懒加载页面组件来提升性能，首屏时间 1s 左右，体验良好。然而大项目文件很多，导致构建和发布时间很长，内存占用较大。我的任务是尽可能优化与此相关的问题。 首先不难发现问题并不在用户体验上，而在于开发…

很明显，我们的对于用户的响应速度和界面渲染速度，提升了 50% 左右。 该工具已经在 npm 发了包，也在 git 提交了项目，有兴趣的可以去看看，顺便点个 star ，谢谢了。 已经有 n 久没有写过文章了，由于最近工作比较忙，而且项目当中对于前端性能还有架构方面的挑战性还是…

骨架屏是预渲染机制中一种增强用户体验的方式，可以理解为是当数据还未加载进来前，页面的一个空白版本，一个简单的关键渲染路径。可以看一下下面 Facebook 的骨架屏实现，可以看到在页面完全渲染完成之前，用户会看到一个样式简单，描绘了当前页面的大致框架的骨架屏页面，然后骨架屏中各…

前面几节我们学习了节流函数 throttle，防抖函数 debounce，以及各自如何在 React 项目中进行应用，今天这篇文章主要聊聊 Lodash 中防抖和节流函数是如何实现的，并对源码浅析一二。下篇文章会举几个小例子为切入点，换种方式继续解读源码，敬请期待。 有什么想法…

缓存，这是一个老生常谈的话题，也常被作为前端面试的一个知识点。 本文，重点在与探讨在实际项目中，如何进行缓存的设置，并给出一个较为合理的方案。 在介绍缓存的时候，我们习惯将缓存分为强缓存和协商缓存两种。两者的主要区别是使用本地缓存的时候，是否需要向服务器验证本地缓存是否依旧有效…