0. 背景 随着构建体系不断完善、构建体验不断优化，webpack 已经逐渐成为了前端构建体系的一大霸主，对于工作中的真正意义上的前端工程项目，webpack 已经成为了我们前端构建技术选型的不二选择，包括 create-react-app 以及 vue-cli 等等业内常见的…

由于 JavaScript 应用程序的复杂性不断增加，构建工具已成为 web 开发中不可或缺的一部分。Bundlers 允许我们去打包、编译和管理现代 web 项目需要的众多资源文件和依赖库。 在本教程中，我们将了解 webpack，一个强大的开源打包和预处理器，可以处理大量复…

本文是作者 Tomek Sułkowski 发布在 medium 上的一个系列。 版权归原作者所有。 译者在翻译前已经和作者沟通得到了翻译整个系列的授权。 1. $0 在 Chrome 的 Elements 面板中，$0 是当前我们选中的 html 节点的引用。 理所当然，$1…

几周前，我开始查看我网站的一些性能指标。具体来说，我想看看我的网站在最新的性能指标 —— 首次输入延迟 （FID）上的表现如何。 我的网站只是一个博客（并没有运行很多的 JavaScript），所以我原本预期会得到相当不错的结果。 用户一般对于小于 100 毫秒的输入延迟没有感…

从上图可以看到，白屏过程几乎是不可避免的，因为无论如何你去优化代码体积，Vue系列类库和你需要的其他核心类库文件加起来至少有几百K，在加上这些文件执行的时间（实测至少500ms），可能大多数情况，我们白屏时间至少1200ms-1500ms了。 当然，我们可以把骨架屏所需的css…

内存和性能之间的斗争始终存在。作为用户，我们希望速度又快占用内存又少。然而通常情况下，提高性能需要消耗更多的内存（反之亦然）。 时间回到2014年，那时Chrome从32位切换到64位。这个变化带给了Chrome更好的安全性、稳定性和性能，但同时也带来了更多内存的消耗，因为之前…

如今 Chrome 浏览器无疑是最受前端青睐的工具，原因除了界面简洁、大量的应用插件，良好的代码规范支持、强大的 V8 解释器之外，还因为 Chrome 开发者工具提供了大量的便捷功能，方便我们前端调试代码，我们在日常开发中是越来越离不开 Chrome，是否熟练掌握 Chrome 调试技巧恐怕也会成为考量前端技术水平的标杆。 介绍 Chrome 调试技巧的文章很多，本文结合我自己的开发经验，希望从实际运用的角度为大家再一次谈一谈这些功能，也希望对大家都有所帮助和启发。

直接进入正题，鼠标跟随，顾名思义，就是元素会跟随着鼠标的移动而作出相应的运动。大概类似于这样： 通常而言，CSS 负责表现，JavaScript 负责行为。而鼠标跟随这种效果属于行为，要实现通常都需要借助 JS。 当然，本文的重点，就是介绍如何在不借助 JS 的情况下使用 CS…

最开始接触函数式编程的时候是在小米工作的时候，那个时候看老大以前写的代码各种 compose，然后一些 ramda 的一些工具函数，看着很吃力，然后极力吐槽函数式编程，现在回想起来，那个时候的自己真的是见识短浅，只想说,'真香'。 最近在研究函数式编程，真的是在学习的过程中感觉…