前端 1943

2

Vue SFC Style CSS 变量注入详解（新版）

• 破晓L   6月28日发布
• 2 收藏

CSS 变量可以跟 JavaScript 更好的通信，CSS 变量是运行时。通过本文你会认识并理解以下概念：SFC Style - 单文件组件的样式；原生 CSS 变量 - CSS 作者定义的标准规范；SFC Style Variables 提案（旧版）；SFC s...

14

Vue 路由组件传参的 8 种方式

• 破晓L   3月12日发布
• 11 收藏

我们在开发单页面应用时，有时需要进入某个路由后基于参数从服务器获取数据，那么我们首先要获取路由传递过来的参数，从而完成服务器请求，所以，我们需要了解路由传参的几种方式，以下方式同 vue-router@4。

5

关于 Vue.js 3.0 UI Library element-plus 官网部分 Demo 失效原因汇总

• 破晓L   2020-11-13 发布
• 4 收藏

在向具名插槽提供内容的时候，在 <template> 元素上使用 v-slot 指令，并以 v-slot 的参数的形式提供其名称。

22

探索类型系统的底层 - 自己实现一个 TypeScript

• 破晓L   2020-07-27 发布
• 17 收藏

这篇文章包含两个部分： A 部分：类型系统编译器概述(包括 TypeScript) 语法 vs 语义 什么是 AST？ 编译器的类型 语言编译器是做什么的？ 语言编译器是如何工作的？ 类型系统编译器职责 高级类型检查器的功能 B ...

20

代码简洁之道：编写干净的 React Components & JSX

• 破晓L   2020-07-20 发布
• 11 收藏

不同团队编写出来的 React 代码也不尽相同，水平各有高低，就像十个读者就有十种哈姆雷特，但是以下八点可能是你编写 React 代码的基本准则。

32

性能优化小册 - 渲染十万条数据：基于 IntersectionObserver 的虚拟化长列表

• 破晓L   2020-06-17 发布
• 24 收藏

技术不局限于框架，相同的原理只是实现方式略有不同。 前置 1. 什么是虚拟列表？ 首先，虚拟列表只是一个概念，本人对虚拟列表这个表述不置可否。 虚拟列表是对于列表形态数据展示的一种按需渲染，是对长列表渲染...

14

性能优化小册 - React 搜索优化：防抖、缓存、LRU

• 破晓L   2020-06-09 发布
• 10 收藏

最近要对 react 项目做重构优化等相关的工作，由于有好长时间没碰 React 了，今天索性把一个基于关键字搜索的 demo 做一下简单优化，在此记录以下。

7

性能优化小册 - 让页面更早的渲染：使用 preload 提升资源加载优先级

• 破晓L   2020-06-04 发布
• 6 收藏

preload 是一个新的 Web 标准，旨在提高性能以及提供给 web 开发者更多的细粒度加载控制。它可以使开发者自定义加载逻辑而避免以 script 标签加载资源所带来的性能损耗。

7

记一次 Angular 基于 STOMP over WebSocket 实现流文本传输

• 破晓L   2020-06-01 发布
• 3 收藏

在介绍正文之前需要先简单了解几个概念： STOMP 协议、STOMP over WebSocket 以及 RxJS。（关于这三点本文不会进行详细介绍）

83

Vue 数据更新了但页面没有更新的 7 种情况汇总及延伸总结

• 破晓L   2020-05-28 发布
• 55 收藏

原因：由于 Vue 会在初始化实例时对 property 执行 getter/setter 转化，所以 property 必须在 data 对象上存在才能让 Vue 将它转换为响应式的。

8

性能优化小册 - 可编程式缓存：Service Workers

• 破晓L   2020-05-26 发布
• 6 收藏

Service Workers 不仅可以应用于 PWA ，PC 端也可以利用其强大的功能实现一些有趣的优化，网络中有很多关于 Service Workers 介绍的比较好的文章，基于小册宗旨，本文并不是一篇 Service Workers 的详细教程。

16

性能优化小册 - 提高网页响应速度：优化你的 CDN 性能

• 破晓L   2020-05-21 发布
• 9 收藏

CDN 服务本身并不具备域名解析功能，而是依托于 DNS 智能解析功能，由 DNS 根据用户所在地、所用线路进行智能分配最合适的 CDN 服务节点，然后把缓存在该服务节点的静态缓存内容返回给用户。

8

性能优化小册 - 分类构建：利用好 webpack hash

• 破晓L   2020-05-18 发布
• 6 收藏

借助 wepack 的 hash 命名法，不仅可以提高我们项目的构建效率，在生产环境中，合理设置 hash 类型有助于我们对资源进行有效的缓存。

13

性能优化小册 - 异步堆栈追踪：为什么 await 胜过 Promise

• 破晓L   2020-05-11 发布
• 9 收藏

与直接使用 Promise 相比，使用 async/await 不仅可以使代码更具可读性，而且还可以在 JavaScript 引擎中实现一些有趣的优化。

21

当无情面试官问 vue-next-router 带来了哪些变化？

• 破晓L   2020-05-08 发布
• 11 收藏

此次 Vue 的重大改进随之而来带来了 Vue Router 的一系列改进，现阶段（alpha.10）相比 vue2-router 的主要变化，总结如下：

23

记一次 Vue 组件设计及 computed 动态引入组件

• 破晓L   2020-04-10 发布
• 18 收藏

本文涉及技术点： 动态组件 & 异步组件 内置组件 keep-alive & transition 插槽 slot 及 v-slot 实际场景 多级 tabs 切换，tab 项不固定，灵活控制 tab 项内容的展示，如下图。 目录结构 目录结构大概像...

16

记一次 <keep-alive> 缓存及其缓存优化原理

• 破晓L   2020-04-03 发布
• 13 收藏

由于缓存空间是有限的，所以不能无限制的进行数据存储，当存储容量达到一个阀值时，就会造成内存溢出，因此在进行数据缓存时，就要根据情况对缓存进行优化，清除一些可能不会再用到的数据。所以根据缓存淘汰的机...

10

JavaScript - 数据结构详解（一）

• 破晓L   2020-01-20 发布
• 9 收藏

数据结构的概念 数据结构，直白的理解，就是研究数据的存储方式。 数据结构是一门学科，它教会我们「如何存储具有复杂关系的数据更有助于后期对数据的再利用」。 存储结构 数据结构大致包含以下几种存储结构： 线...

32

网站性能优化实战篇

• 破晓L   2019-11-24 发布
• 23 收藏

阅读理由：经验之谈，从理论到实践。 前情摘要 网站优化是前端开发的重中之重，但是优化细节却十分繁杂，没有好的思路，优化很难高效的开展。 本文将以实际网站来做参考，手把手教你如何一步步做好网站优化。 这...

32

CSS 渲染原理以及优化策略

• 破晓L   2019-11-21 发布
• 25 收藏

提起 CSS 很多童鞋都很不屑，尤其是看到 RedMonk 2019 Programming Language Rankings 的时候，CSS 竟然排到了第七位。