但是在类库模式的构建上却有所欠缺，只能处理单个输入和单输入出的情况，构建场景单一，Vite 社区上目前也没有可直接使用的工具，所以才有了开发一个统一构建插件的想法。

Vite 相对于 Webpack 上手难度小，简单的配置，开箱即用。虽然目前生态不如 Webpack，不过生态也逐渐的丰富起来。经过了一些 Vite 插件编写实践，今天来说说虚拟模块（Virtual Modules ），也顺便介绍下 vite-plugin-project-info 插件。虚拟模块的概念虚拟模块是 Vite 沿用 Rollup 的虚拟模块，虚拟模块类似 alias 别名...

前言无论团队大小，随着时间的推进，多多少少都会有一些可提取的业务组件，沉淀组件库和对应的文档是一条必经之路。直接进入正题，从 0 到 1 开始搞一个业务组件库（可从注释中生成）。最终的 Demo 可看这里，请使用 Mac 或者 Linux 终端来运行，windows 兼容性未做验证。使用到工具这三个工具是后续业务组件库搭建使用...

前言随着时间的推进，业务组件也逐渐丰富起来，我们开始搭建组件库，编写组件文档的烦恼就随之而来。这里分享下我选取组件文档工具的经历，最终以 Docusaurus 为基础，搭建了一套开箱即用的 React 组件文档工具。此工具经过了两年时间的沉淀也是比较稳定，所以分享出来给有需要的人员使用，直接体验可看 react-doc-start...

平常我们都是不建议在代码上编写一些比较难理解的代码，例如 x == y 和 'A' > 'B' 。这篇文章或许不能给你带来什么大的帮助，但是却可以让你了解一些你可能没接触到的知识点。

Promise 已经是前端不可缺少的 API，现在已经是无处不在。你确定已经很了解 Promise 吗？如果不是很了解，那么应该了解 Promise 的实现原理。如果你觉得你自己挺了解的，那么你自己实现过 Promise 吗？

例子都可以在 Console 中运行的（谷歌版本 76.0.3809.100），都是以最新浏览器支持的 JavaScript 特性来编写的，不考虑兼容性。

这篇文章是针对浏览器的 JavaScript 脚本，Node.js 大同小异，这里不涉及到 Node.js 的场景。当然 Node.js 作为服务端语言，必然更关注内存泄漏的问题。

学习和总结文章同步发布于 [链接]，有兴趣可以关注一下，一起学习和进步。Http 优化方式是前端性能优化的重要部分，也是前端必备的知识点之一。减少静态资源文件大小这个是最根本的途径，假设真的有个 10 几兆以上的静态资源文件，不减少大小的情况下，即使优化做到了极致，用户体验也好不了哪里去。如果整个网页就 2KB ...

HTTPS = HTTP + TLS/SSL，简单理解 HTTPS 其实就是在 HTTP 上面加多了一层安全层。HTTP 可以是 Http2.0 也可以是 Http1.1，不过现在 Http2.0 是强制要求使用 Https 的。

在软件架构中，发布-订阅是一种消息范式，消息的发送者（称为发布者）不会将消息直接发送给特定的接收者（称为订阅者）。而是将发布的消息分为不同的类别，无需了解哪些订阅者（如果有的话）可能存在。同样的，订阅者可以表达对一个或多个类别的兴趣，只接收感兴趣的消息，无需了解哪些发布者（如果有的话）存在。

设计模式是前人解决某个特定场景下对而总结出来的一些解决方案。可能刚开始接触编程还没有什么经验的时候，会感觉设计模式没那么好理解，这个也很正常。有些简单的设计模式我们有时候用到，不过没意识到也是存在的。

Svelte 的作者也是 rollup 的作者 Rich Harris，前端界的轮子哥。sevlte 项目首次提交于 2016 年 11 月 16 日，目前版本是 3.6.1（2019-06-27），v3 版本进行了大改动，跟之前的版本有很大的差别（v1、v2 版本 API 用法跟 vue 很像，v3 完全属于自己的风格）。

例子是在 jsrun.net 平台编写，不支持移动端平台，所以本文建议在 PC 端进行阅读。 Vue 是数据驱动的视图框架，那么组件间的数据通信是必然的事情，那么组件间如何进行数据传递呢？ 首先组件间通信有父子组件、兄弟组件、堂兄弟组件、叔侄组件等，分类太多可能不好理解，我们暂且分为： 父子组件通信 子父组件通信 非父...

所谓生命周期钩子函数（简称生命周期函数），指的是组件的创建、更新、销毁三个阶段所触发执行的函数。根据每个阶段触发的钩子函数，我们可以相应的做一些操作，如获取后端接口数据、监听事件、执行事件、执行定时器、移除事件、清理定时器等等。

同步发布于 [链接] 是个程序员都知道函数，但是有些人不一定清楚函数式编程的概念。 应用的迭代使程序变得越来越复杂，那么程序员很有必要创造一个结构良好、可读性好、重用性高和可维护性高的代码。 函数式编程就是一个良好的代码方式，但是这不代表函数式编程是必须的。你的项目没用到函数式编程，不代表项目不好。 什...

我的建议是不要隐藏错误，勇敢地抛出来。没有人会因为代码出现 bug 导致程序崩溃而羞耻，我们可以让程序中断，让用户重来。错误是无法避免的，如何去处理它才是最重要的。

简单来说，浏览器缓存就是把一个已经请求过的Web资源（如html，图片，js）拷贝一份副本储存在浏览器中。缓存会根据进来的请求保存输出内容的副本。当下一个请求来到的时候，如果是相同的URL，缓存会根据缓存机制决定是直接使用副本响应访问请求，还是向源服务器再次发送请求（当然还有304的情况）。

JSX(JavaScript XML)是 js 内定义的一套类 XML 语法，可以解析出目标 js 代码，颠覆传统 js 写法。HTML 由浏览器解析，而 JSX 是由 js 解析。当让也可以通过构建工具先解析生成，如 grunt、 webpack ,这样可以减少代码这行中 js 解析 JSX 的时间，这个后面会专题讲诉。JSX 原本是使用官方自己提供的方法处理，2015-7-12 ...

使用React我们首先要知道如何传递数据，组件如何沟通，才能展示我们想要的数据。下面的列子都是使用ES6语法，不懂的同学需要先学习ES6语法。

此文章适合 React@17 之前的版本，React@16.3.0，添加了一些新的生命周期函数，同时准备废弃一些会造成困扰的生命周期函数。所有如果在React@17 发布之前，这篇文章还是适用的。新的生命周期请看官网 blog 文章 React v16.3.0: New lifecycles and context API。

众所周知，浏览器的重绘和重排版(reflows & repaints)（DOM操作都会引起）才是导致网页性能问题的关键。而React虚拟DOM的目的就是为了减少浏览器的重绘和重排版。

那什么是高级组件？首先你得先了解请求ES6中的class只是语法糖，本质还是原型继承。能够更好的进行说明，我们将不会修改组件的代码。而是通过提供一些能够包裹组件的组件， 并通过一些额外的功能来增强组件。这样的组件我们称之为高阶组件（Higher-Order Component）。

主要是总结浏览器CORS跨域处理方式，其他处理方式的本人认为是伪跨域处理方式，如iframe、window.name、window.postMessage。