Frank313

在一个风和日丽的下午，我正在埋头苦（mo）干（yu）的时候，QA 同学急冲冲的跑了过来跟我说：你这网页怎么又挂了呀？这我必须给你提个 P0 的 bug 了！ 我本能的脱口而...

某天，小明同学突然反馈 ：“昨晚发现根本无法使用你们的应用... ....怎么回事呢”。我和我的小伙伴们立马惊呆了，心想：“老司机多年的经验有一种预感，那就是同学你使用姿势...

chunkhash和hash不一样，它根据不同的入口文件(Entry)进行依赖文件解析、构建对应的chunk，生成对应的哈希值。我们在生产环境里把一些公共库和程序入口文件区...

在日常项目开发中构建工具是必不可少的，所以也是我们需要掌握学习的一个重要部分，在技术蓬勃发展的今天，许多优秀的构建工具涌现出来，前端主流打包工具主要有 grunt，gulp...

happypack提供的loader，是对文件实际匹配的处理loader。这里happypack提供的loader与plugin的衔接匹配，则是通过id=happypack...

本文主要是讲讲如何使用 Next.js 框架实现服务端渲染，重构或优化现有前端应用的 SEO 和首屏渲染速度。...

说到webpack的性能优化，其实就是从时间层面与体积层面入手。对于时间层面主要就是优化webpack的构建速度（缩短构建时间）。对于体积层面主要就是优化webpack的构...

webpack4 持久化缓存 hash、chunkhash 和 contenthash 的区别 chunkId namedModules namedChunks...

前段时间使用Next.js(13.x)开发一个展示类型的官网，功能比较简单。正式上线前，使用Lighthouse 评测，并做了些性能优化，整体评分达到了90+ ，在此简单总...

随着项目不断发展壮大，组件数量开始变得越来越多，项目也开始变得庞大，webpack 编译的时间也会越来越久，我们现在的项目编译一次在 40s ——70s 之间，这是一个效率...

如果大家看过一些 webpack4 优化的文章，一定会出现 dll 动态链接库。它以配置之复杂让众多初学者记忆犹新。今天我会以一个学习者的角度去一步一步探讨 webpack...

面试过程中面试官问到前端性能优化有哪些，当我咔咔一顿输出之后面试官追问：前端可以做的性能优化有哪些呢？ 前端优化大概可以有以下几个方向： 网络优化 页面渲染优化 JS优化 ...

浅谈前端曝光率高的九大设计模式。分别从创建型：构造器模式、共产模式、单例模式；结构型：适配器模式、装饰器模式、代理模式；行为型：观察者模式、模板模式、命令模式...

如何去优化一个历史悠久项目的构建效率，功能不断增加，代码变得臃肿，依赖关系复杂，导致启动和打包项目的时间变得越来越长...

一、Webpack 现状 最初的 Webpack 主打 Bundle 并且支持「Code Splitting」；在经过一段爆发式增长后，最有用的功能之一：热更新 Hot M...

在上两章节中我们已经介绍过了 JavaScript 打包机制 以及 webpack 所有的内置配置，但当项目业务功能达到一定规模时，默认的配置已经不足以满足开发、用户的期望...

本文将先介绍 Webpack 编译构建流程，了解编译构建主要耗时在哪些地方；然后介绍如何收集 Webpack 编译性能数据，以及使用工具分析编译性能瓶颈；最后介绍几个有效减...

今天前同事找到我，向我请教了一个性能优化的问题，我简单的跟他回答了一下例如组件懒加载、路由懒加载、开启gzip、公共的第三方包上cdn、还有基础的雅虎53条军规一条条排查等...

webpack编译时简单的样式美化，包括编译进程，模块，还有打包结束时的提示，类似于平常我们使用脚手架创建的项目。...

webpack 打包优化并没有什么固定的模式，一般我们常见的优化就是拆包、分块、压缩等，并不是对每一个项目都适用，针对于特定项目，需要不断调试不断优化。 对于 webpac...