前端森林

前一段时间我把webpack源码大概读了一遍，webpack 到4.x版本后，其源码已经比较庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。 过度分析源码对于大家并没有太大的帮助。本文主要是想通过分析webpack的构建流程以及实现一个简单的webpack来让大家对we…

一些开源的生产力工具能极大的提升我们的开发效率（我一直是这么认为的 🤠）。 今天推荐一些我一直在用的、比较香的工具给大家。其中包括一些文档、可视化工具、分析工具、代码片段、调试工具等。 Collect UI画廊是一个免费的在线资源，用于每日UI设计灵感。 目前，它有 6500…

webpack的打包优化一直是个老生常谈的话题，常规的无非就分块、拆包、压缩等。 本文以我自己的经验向大家分享如何通过一些分析工具、插件以及webpack新版本中的一些新特性来显著提升webpack的打包速度和改善包体积，学会分析打包的瓶颈以及问题所在。 webpack 有时候…

优化关键渲染路径可以提升首屏渲染时间。理解和优化关键渲染路径对于确保回流和重绘可以每秒 60 帧、确保高性能的用户交互和避免无意义渲染至关重要。 我想对于性能优化，大家都不陌生，无论是平时的工作还是面试，是一个老生常谈的话题。 如果单纯针对一些点去泛泛而谈，我想是不太严谨的。 …

由于业务需要，近期团队要搞一套自己的UI组件库，框架方面还是Vue。而业界已经有比较成熟的一些UI库了，比如ElementUI、AntDesign、Vant等。 结合框架Vue，我们选择在ElementUI基础上进行改造。但造轮子绝非易事，首先需要先去了解它整个但构建流程、目录…

我们平时的工作中，github是必不可少的代码托管平台，但是大多数同学也只是把它做为了托管代码的地方，并没有合理的去运用。 其实github里面有非常多好玩或者有趣的地方的。当然，这些技巧也能对你的工作效率有很大的提升。 可能很多人并没有听过Gist。它在github首页的子目…

算法一直是大厂前端面试常问的一块，而大家往往准备这方面的面试都是通过leetcode刷题。 我特地整理了几道leetcode中「很有意思」而且非常「高频」的算法题目，分别给出了思路分析（带图解）和代码实现。 给定一个整数数组 nums 和一个目标值 target，请你在该数组中…

写这篇文章的缘由是上周在公司前端团队的code review时，看了一个实习小哥哥的代码后，感觉一些刚入行不久的同学，对于真实项目中的一些js处理不是很熟练，缺乏一些技巧。 因此整理了自己开发中常用的一些js技巧，灵活的运用，会增强你解决问题的能力，也会对你的代码简洁性有很大的…

作为开发人员，平时用的最多的就是Chrome devtools了，但是可能很多同学都像我一样平时用的最多也就只是Console和Elements面板了。 按Cmd + Shift + P（如果使用Windows，则按Ctrl + Shift + P）打开“命令”菜单。 当你只想…