本篇文章将介绍一些webpack的进阶用法，演示内容继承自上一篇文章的内容，所以没看过上一篇文章的建议先学习上一篇内容再阅读此篇内容，会更有利于此篇的学习～

webpack 是一种用于构建 JS 应用程序的静态模块打包器，它能够以一种相对一致的处理方式，加载应用中的所有资源文件（图片、CSS、视频、字体文件等），并将其合并打包成浏器兼容的 Web 资源。

我们平时在写代码的过程中，好像很少需要自己手动进行垃圾回收，那么V8是如何来减少内存占用，从而避免内存溢出而导致程序崩溃的情况的。为了更高效地回收垃圾，V8引入了两个垃圾回收器。

V8采用了一种权衡策略，在启动时采用解释执行的策略，但是如果某段代码的执行频率超过某个值，V8就会采用优化编译器将其编译成执行效率更高的机器代码。

在这之前我写过这样一篇文章教你用canvas打造一个炫酷的碎片切图效果，这个效果是用Canvas来实现的，现在想着尝试使用CSS Paint API来实现一个类似的碎片效果。

yarn的出现则是为了解决npm带来的诸多问题，虽然yarn提高了依赖包的安装速度与使用体验，但它依旧没有解决npm的依赖重复安装等致命问题。pnpm的出现完美解决了依赖包重复安装的问题。

我们知道webpack有个通病，那就是随着项目的不断增大每次构建的时间也会随之越来越长。一起来看看如何将项目的冷启动时长从1分20秒左右优化到十几秒左右吧～

说起媒体查询想必大家最先想到的都是CSS中@media，没错，这是我们最常用的媒体查询方法，主要用来为我们的网站做适配处理。 比如： 我们使用 CSS 告诉浏览器标题需要为绿色，字体大小为 2rem

对象属性列表是通过 EnumerableOwnPropertyNames 获取的，其中比较重要的是调用对象的内部方法 OwnPropertyKeys 获得对象的ownKeys