【Vite 实践】Vite 库模式能满足你吗?或许你需要统一构建

2022-08-30
阅读 7 分钟
9.3k
但是在类库模式的构建上却有所欠缺,只能处理单个输入和单输入出的情况,构建场景单一,Vite 社区上目前也没有可直接使用的工具,所以才有了开发一个统一构建插件的想法。
封面图

Vite 插件编写之虚拟模块

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

手把手教你快速搭建React组件库

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

你还在为组件文档烦恼吗?

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

你真的理解了比较运算符吗?

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

如何写一个让面试官满意的 Promise?

2019-09-30
阅读 21 分钟
3.5k
Promise 已经是前端不可缺少的 API,现在已经是无处不在。你确定已经很了解 Promise 吗?如果不是很了解,那么应该了解 Promise 的实现原理。如果你觉得你自己挺了解的,那么你自己实现过 Promise 吗?

如何写一个让面试官满意的 Generator 执行器?

2019-09-05
阅读 10 分钟
4.6k
例子都可以在 Console 中运行的(谷歌版本 76.0.3809.100),都是以最新浏览器支持的 JavaScript 特性来编写的,不考虑兼容性。

深入了解 JavaScript 内存泄露

2019-08-30
阅读 9 分钟
24.8k
这篇文章是针对浏览器的 JavaScript 脚本,Node.js 大同小异,这里不涉及到 Node.js 的场景。当然 Node.js 作为服务端语言,必然更关注内存泄漏的问题。

前端优化之 Http 相关优化总结

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

HTTPS 的基本原理

2019-08-27
阅读 1 分钟
5.2k
HTTPS = HTTP + TLS/SSL,简单理解 HTTPS 其实就是在 HTTP 上面加多了一层安全层。HTTP 可以是 Http2.0 也可以是 Http1.1,不过现在 Http2.0 是强制要求使用 Https 的。

订阅发布模式和观察者模式的区别

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

JavaScript 的一些常用设计模式

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

Svelte 前端框架探索

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

Vue 组件间通信方式

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

Vue 组件生命周期钩子函数

2019-05-17
阅读 6 分钟
9.7k
所谓生命周期钩子函数(简称生命周期函数),指的是组件的创建、更新、销毁三个阶段所触发执行的函数。根据每个阶段触发的钩子函数,我们可以相应的做一些操作,如获取后端接口数据、监听事件、执行事件、执行定时器、移除事件、清理定时器等等。

JavaScript 之函数式编程

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

JavaScript之错误异常探讨

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

浏览器之HTTP缓存的那些事

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

JSX简介

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

React 组件数据流 && 组件间沟通

2016-09-06
阅读 7 分钟
22.9k
使用React我们首先要知道如何传递数据,组件如何沟通,才能展示我们想要的数据。下面的列子都是使用ES6语法,不懂的同学需要先学习ES6语法。

React组件生命周期

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

React 组件性能优化

2016-08-28
阅读 5 分钟
7.2k
众所周知,浏览器的重绘和重排版(reflows & repaints)(DOM操作都会引起)才是导致网页性能问题的关键。而React虚拟DOM的目的就是为了减少浏览器的重绘和重排版。

React高阶组件替代Mixins

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

前端跨域问题(CORS)

2016-08-26
阅读 7 分钟
19.9k
主要是总结浏览器CORS跨域处理方式,其他处理方式的本人认为是伪跨域处理方式,如iframe、window.name、window.postMessage。