今天介绍下 Chrome dev tools 家族的一个小兄弟，它在 Chrome 57 之前叫作「Timeline」，而现在换了个更长的马甲 —— 「Performance」，毕竟名字要「长～～～～～～～～～」更能吸引注意。 也许你曾不经意启动过这个工具，看见里面五颜六色的图…

Performance 一个在前端开发领域中，无法被忽视的存在，如果我们的开发是一个满足需求就可以的产品，那么可能就用不到它；但是如果我们想对我们的这个产品，做一个极致的优化，那么 Performance 是一个很好的选择，也是一个不容忽视的选择。 大致的介绍了一下工具和api…

自JavaScript诞生以来，前端技术发展非常迅速。移动端白屏优化是前端界面体验的一个重要优化方向，Web 前端诞生了 SSR 、CSR、预渲染等技术。在美团支付的前端技术体系里，通过预渲染提升网页首帧优化，从而优化了白屏问题，提升用户体验，并形成了最佳实践。 通过对比，同构…

风和日丽: 我正笑嘻嘻地抓着我炫酷的ikbc键盘疯狂的敲着Bug. 晴天霹雳: 被拉进了一个群,产品说我做的网站很卡,需要做性能优化. 难以置信: 我可是用尊贵的Vue3+T

在搜索引擎网站的后台会有一个非常庞大的数据库，里面存储了海量的关键词，而每个关键词又对应着很多网址，这些网址是被称之为“搜索引擎蜘蛛”或“网络爬虫”程序从茫茫的互联网上一点一点下载收集而来的。随着各种各样网站的出现，这些勤劳的“蜘蛛”每天在互联网上爬行，从一个链接到另一个链接，…

1.重要性 当我们面试的时候，前端性能优化方面算是必考的知识点，但是工作中我们又很少会重点的对项目进行前端优化，它真的不重要吗？ 如果我们可以将后端响应时间缩短一半，整体响应时间只能减少5%~10%。

也就是说，渲染包含十万条记录，每一条数据仅仅只有图片和文字的简单组合，就要花费将近17秒。页面渲染完成之前，估计用户早已不耐烦，关掉该页面了。这还是版本较新的chrome浏览器。换做其他浏览器，可能效果更差。很显然，传统的方式肯定不合格。 3、循环一个数组对象，可以用for循环…

通常在页面开发中，我们是通过路由去管理不同的页面，常用的路由库也有很多，譬如：React-Router，Dva-router...... 当我们切换路由时，没有被匹配到的 Component 也会被整体替换掉，原有的状态也丢失了，因此，当用户从详情页退回到列表页时，会重新加载列…

通常来讲前端性能优化是指从用户开始访问我们的网站到整个页面完整的展现出来的过程中，通过各种优化策略和优化方法让页面加载的更快，让用户的操作响应更及时，给用户更好的使用体验。 这里我们介绍的是前端性能优化知识的解决方案，从静态资源优化开始入手，从表象深入体系化的讲解页面渲染架构，…