Blog

九层之台，起于累土；千里之行，始于足下。

前端优化

• 前端优化实践总结

• 一个性能优化脑图

TypeScript 类型

包含自己理解/求证溯源的过程~。

• TypeScript 类型体操 1 遍历，推断，基础类型
• TypeScript 类型体操 2
• TypeScript 类型体操 3 深入联合类型

框架向工具

• Vite + React 开源框架向脚手架(rollup 插件，style 分离合并)

• Vue3 + Vite + Webpack + Ts + Pinia 基础脚手架

• 基于 CSS 的可配置大转盘 Vue3

• 虚拟列表 Vue3

• 拖拽插件 Vue2

• 基于 Proxy 的响应式系统

源码阅读

里面是一些自己解读的思考混有一些仿写。

• axios 源码阅读

• webpack 动态加载阅读

• fre 源码阅读

• Vue3-Reactivity 仿写(基于 Observer-utils)

• petite-vue 源码阅读+仿写(已实现模板解析，data 响应式，v-show，@事件功能)

• petite-vue 的仿写

SVG 方面

• 微信炸屎 svg

• 任意元素添加水波纹 svg

• 红包雨 svg

• svg stroke-dasharray 做动画小例(可以做一些有趣的图标描边显隐)

• SVG 指南(译)

canvas

• 从零开始实现一个图片裁剪工具

Wireshark 抓包分析

• tcp && ip.addr == 123.206.177.175.pcapng 拖到 Wireshark 中按条件过滤。

安全方面

• 浅浅的 XSS