{"id":25337586,"url":"https://github.com/chenxiaoyao6228/fe-notes","last_synced_at":"2025-10-29T09:30:58.684Z","repository":{"id":115155877,"uuid":"590981831","full_name":"chenxiaoyao6228/fe-notes","owner":"chenxiaoyao6228","description":"收集整理前端基础知识以及开发实践。包括前端八股，最佳实践，踩坑汇总等，既有完整的系列，也有零碎的思考。","archived":false,"fork":false,"pushed_at":"2024-12-19T05:09:05.000Z","size":6370,"stargazers_count":16,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-12-19T06:21:18.745Z","etag":null,"topics":["angular","canvas","css","front-end-development","interview","javascript","nodejs","react","vue"],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chenxiaoyao6228.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-01-19T16:59:59.000Z","updated_at":"2024-12-19T05:09:10.000Z","dependencies_parsed_at":"2023-12-20T14:56:36.406Z","dependency_job_id":"6417240a-a77f-411c-8294-7e9d92728e74","html_url":"https://github.com/chenxiaoyao6228/fe-notes","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenxiaoyao6228%2Ffe-notes","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenxiaoyao6228%2Ffe-notes/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenxiaoyao6228%2Ffe-notes/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenxiaoyao6228%2Ffe-notes/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chenxiaoyao6228","download_url":"https://codeload.github.com/chenxiaoyao6228/fe-notes/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238798679,"owners_count":19532276,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","canvas","css","front-end-development","interview","javascript","nodejs","react","vue"],"created_at":"2025-02-14T06:56:02.653Z","updated_at":"2025-10-29T09:30:58.678Z","avatar_url":"https://github.com/chenxiaoyao6228.png","language":"HTML","readme":"# fe-notes(前端开发笔记)\n\n\u003e I'm a slow walker, but I never walk backwards. — Abragam Lincoln.\n\n本仓库旨在收集整理前端基础知识以及开发实践。包括前端八股，最佳实践，踩坑汇总等，既有完整的系列，也有零碎的思考。\n\n## 目录\n\n- Webpack\n  - [1-实现 mini-webpack](Webpack%2F1-%E5%AE%9E%E7%8E%B0mini-webpack.md)\n  - [2-webpack 中 loader 的运行机制](Webpack%2F2-webpack%E4%B8%ADloader%E7%9A%84%E8%BF%90%E8%A1%8C%E6%9C%BA%E5%88%B6.md)\n  - [3-webpack 中的 tabpable](Webpack%2F3-webpack%E4%B8%AD%E7%9A%84tabpable.md)\n  - [AMD 与 RequireJS](Webpack%2FAMD%E4%B8%8ERequireJS.md)\n  - [CMD 与 SeaJS](Webpack%2FCMD%E4%B8%8ESeaJS.md)\n  - [CommonJS 与 Node](Webpack%2FCommonJS%E4%B8%8ENode.md)\n  - [ES6-module](Webpack%2FES6-module.md)\n  - [Tree-shaking 工作原理](Webpack%2FTree-shaking%E5%B7%A5%E4%BD%9C%E5%8E%9F%E7%90%86.md)\n  - [UMD](Webpack%2FUMD.md)\n  - [package.json 中模块化相关的字段](Webpack%2Fpackage.json%E4%B8%AD%E6%A8%A1%E5%9D%97%E5%8C%96%E7%9B%B8%E5%85%B3%E7%9A%84%E5%AD%97%E6%AE%B5.md)\n  - [vite 的工作原理](Webpack%2Fvite%E7%9A%84%E5%B7%A5%E4%BD%9C%E5%8E%9F%E7%90%86.md)\n  - [webpack 动态加载](Webpack%2Fwebpack%E5%8A%A8%E6%80%81%E5%8A%A0%E8%BD%BD.md)\n  - [webpack 模块联邦原理](Webpack%2Fwebpack%E6%A8%A1%E5%9D%97%E8%81%94%E9%82%A6%E5%8E%9F%E7%90%86.md)\n  - [重新梳理前端模块化](Webpack%2F%E9%87%8D%E6%96%B0%E6%A2%B3%E7%90%86%E5%89%8D%E7%AB%AF%E6%A8%A1%E5%9D%97%E5%8C%96.md)\n- Browser*网络*安全\n  - [0-从输入 URL 到浏览器渲染发生了什么](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F0-%E4%BB%8E%E8%BE%93%E5%85%A5%20URL%20%E5%88%B0%E6%B5%8F%E8%A7%88%E5%99%A8%E6%B8%B2%E6%9F%93%E5%8F%91%E7%94%9F%E4%BA%86%E4%BB%80%E4%B9%88.md)\n  - [Cookie](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FCookie.md)\n  - [DNS 解析](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FDNS%E8%A7%A3%E6%9E%90.md)\n  - [HTTP1](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FHTTP1.md)\n  - [HTTP2](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FHTTP2.md)\n  - [HTTP3](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FHTTP3.md)\n  - [HTTPS](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FHTTPS.md)\n  - [JS 中的执行原理-变量提升、调用栈、作用域以及闭包](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FJS%E4%B8%AD%E7%9A%84%E6%89%A7%E8%A1%8C%E5%8E%9F%E7%90%86-%E5%8F%98%E9%87%8F%E6%8F%90%E5%8D%87%E3%80%81%E8%B0%83%E7%94%A8%E6%A0%88%E3%80%81%E4%BD%9C%E7%94%A8%E5%9F%9F%E4%BB%A5%E5%8F%8A%E9%97%AD%E5%8C%85.md)\n  - [Nginx 必知必会](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FNginx%E5%BF%85%E7%9F%A5%E5%BF%85%E4%BC%9A.md)\n  - [SSE(server-send-event)](\u003cBrowser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FSSE(server-send-event).md\u003e)\n  - [TCP 三次握手四次挥手](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FTCP%E4%B8%89%E6%AC%A1%E6%8F%A1%E6%89%8B%E5%9B%9B%E6%AC%A1%E6%8C%A5%E6%89%8B.md)\n  - [webRTC](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2FwebRTC.md)\n  - [web 安全-内容安全策略 CSP](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E5%AE%89%E5%85%A8-%E5%86%85%E5%AE%B9%E5%AE%89%E5%85%A8%E7%AD%96%E7%95%A5CSP.md)\n  - [web 安全-同源策略与跨域解决](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E5%AE%89%E5%85%A8-%E5%90%8C%E6%BA%90%E7%AD%96%E7%95%A5%E4%B8%8E%E8%B7%A8%E5%9F%9F%E8%A7%A3%E5%86%B3.md)\n  - [web 安全-点击劫持](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E5%AE%89%E5%85%A8-%E7%82%B9%E5%87%BB%E5%8A%AB%E6%8C%81.md)\n  - [web 安全渗透之 CSRF](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E5%AE%89%E5%85%A8%E6%B8%97%E9%80%8F%E4%B9%8BCSRF.md)\n  - [web 安全渗透之 XSS](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E5%AE%89%E5%85%A8%E6%B8%97%E9%80%8F%E4%B9%8BXSS.md)\n  - [web 缓存-CDN 缓存以及回源机制](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E7%BC%93%E5%AD%98-CDN%E7%BC%93%E5%AD%98%E4%BB%A5%E5%8F%8A%E5%9B%9E%E6%BA%90%E6%9C%BA%E5%88%B6.md)\n  - [web 缓存](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2Fweb%E7%BC%93%E5%AD%98.md)\n  - [加密算法](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E5%8A%A0%E5%AF%86%E7%AE%97%E6%B3%95.md)\n  - [响应头状态码](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E5%93%8D%E5%BA%94%E5%A4%B4%E7%8A%B6%E6%80%81%E7%A0%81.md)\n  - [浏览器的多进程架构](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E6%B5%8F%E8%A7%88%E5%99%A8%E7%9A%84%E5%A4%9A%E8%BF%9B%E7%A8%8B%E6%9E%B6%E6%9E%84.md)\n  - [理解 HTTP 中的 Content-type](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E7%90%86%E8%A7%A3HTTP%E4%B8%AD%E7%9A%84Content-type.md)\n  - [理解 get 和 post](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E7%90%86%E8%A7%A3get%E5%92%8Cpost.md)\n  - [跨域验证的方案](Browser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E8%B7%A8%E5%9F%9F%E9%AA%8C%E8%AF%81%E7%9A%84%E6%96%B9%E6%A1%88.md)\n  - [长轮询(Long polling)](\u003cBrowser_%E7%BD%91%E7%BB%9C_%E5%AE%89%E5%85%A8%2F%E9%95%BF%E8%BD%AE%E8%AF%A2(Long%20polling).md\u003e)\n- Canvas\n  - [Excalidraw 初探](Canvas%2FExcalidraw%E5%88%9D%E6%8E%A2.md)\n  - [canvas 中的图片处理](Canvas%2Fcanvas%E4%B8%AD%E7%9A%84%E5%9B%BE%E7%89%87%E5%A4%84%E7%90%86.md)\n  - [canvas 使用贝塞尔曲线优化自由画笔并探究其原理](Canvas%2Fcanvas%E4%BD%BF%E7%94%A8%E8%B4%9D%E5%A1%9E%E5%B0%94%E6%9B%B2%E7%BA%BF%E4%BC%98%E5%8C%96%E8%87%AA%E7%94%B1%E7%94%BB%E7%AC%94%E5%B9%B6%E6%8E%A2%E7%A9%B6%E5%85%B6%E5%8E%9F%E7%90%86.md)\n  - [canvas 坐标及无限画布的原理](Canvas%2Fcanvas%E5%9D%90%E6%A0%87%E5%8F%8A%E6%97%A0%E9%99%90%E7%94%BB%E5%B8%83%E7%9A%84%E5%8E%9F%E7%90%86.md)\n  - [canvas 尺寸](Canvas%2Fcanvas%E5%B0%BA%E5%AF%B8.md)\n  - [canvas 性能优化](Canvas%2Fcanvas%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96.md)\n  - [canvas 性能分析的手段](Canvas%2Fcanvas%E6%80%A7%E8%83%BD%E5%88%86%E6%9E%90%E7%9A%84%E6%89%8B%E6%AE%B5.md)\n  - [canvas 文本渲染](Canvas%2Fcanvas%E6%96%87%E6%9C%AC%E6%B8%B2%E6%9F%93.md)\n  - [canvas 画布擦除功能](Canvas%2Fcanvas%E7%94%BB%E5%B8%83%E6%93%A6%E9%99%A4%E5%8A%9F%E8%83%BD.md)\n- 性能优化\n  - [0-README](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F0-README.md)\n  - [GPU 加速](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2FGPU%E5%8A%A0%E9%80%9F.md)\n  - [Gzip 工作原理](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2FGzip%E5%B7%A5%E4%BD%9C%E5%8E%9F%E7%90%86.md)\n  - [React profile 优化 React 应用](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2FReact%20profile%E4%BC%98%E5%8C%96React%E5%BA%94%E7%94%A8.md)\n  - [React 代码优化](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2FReact%E4%BB%A3%E7%A0%81%E4%BC%98%E5%8C%96.md)\n  - [css 优化](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2Fcss%E4%BC%98%E5%8C%96.md)\n  - [react-ssr 原理分析](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2Freact-ssr%E5%8E%9F%E7%90%86%E5%88%86%E6%9E%90.md)\n  - [script 标签中的 async 与 defer](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2Fscript%E6%A0%87%E7%AD%BE%E4%B8%AD%E7%9A%84async%E4%B8%8Edefer.md)\n  - [webpack 构建优化](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2Fwebpack%E6%9E%84%E5%BB%BA%E4%BC%98%E5%8C%96.md)\n  - [web 资源加载优先级](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2Fweb%E8%B5%84%E6%BA%90%E5%8A%A0%E8%BD%BD%E4%BC%98%E5%85%88%E7%BA%A7.md)\n  - [回流与重绘](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F%E5%9B%9E%E6%B5%81%E4%B8%8E%E9%87%8D%E7%BB%98.md)\n  - [图片优化](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F%E5%9B%BE%E7%89%87%E4%BC%98%E5%8C%96.md)\n  - [性能优化的指标](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%E7%9A%84%E6%8C%87%E6%A0%87.md)\n  - [性能检测指标与工具](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F%E6%80%A7%E8%83%BD%E6%A3%80%E6%B5%8B%E6%8C%87%E6%A0%87%E4%B8%8E%E5%B7%A5%E5%85%B7.md)\n  - [用户交互体验优化](%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96%2F%E7%94%A8%E6%88%B7%E4%BA%A4%E4%BA%92%E4%BD%93%E9%AA%8C%E4%BC%98%E5%8C%96.md)\n- Javascript\n  - [ Node 中事件循环](Javascript%2F%20Node%E4%B8%AD%E4%BA%8B%E4%BB%B6%E5%BE%AA%E7%8E%AF.md)\n  - [ES-Next 新特性](Javascript%2FES-Next%20%E6%96%B0%E7%89%B9%E6%80%A7.md)\n  - [HTML 中的焦点管理](Javascript%2FHTML%E4%B8%AD%E7%9A%84%E7%84%A6%E7%82%B9%E7%AE%A1%E7%90%86.md)\n  - [JS 中的事件捕获与冒泡](Javascript%2FJS%20%E4%B8%AD%E7%9A%84%E4%BA%8B%E4%BB%B6%E6%8D%95%E8%8E%B7%E4%B8%8E%E5%86%92%E6%B3%A1.md)\n  - [JS 中使用 IndexDB](Javascript%2FJS%E4%B8%AD%E4%BD%BF%E7%94%A8IndexDB.md)\n  - [JS 中的 BigInt](Javascript%2FJS%E4%B8%AD%E7%9A%84BigInt.md)\n  - [JS 中的 proxy 和 defineProperty](Javascript%2FJS%E4%B8%AD%E7%9A%84proxy%E5%92%8CdefineProperty.md)\n  - [JS 中的二进制](Javascript%2FJS%E4%B8%AD%E7%9A%84%E4%BA%8C%E8%BF%9B%E5%88%B6.md)\n  - [JS 中的位运算](Javascript%2FJS%E4%B8%AD%E7%9A%84%E4%BD%8D%E8%BF%90%E7%AE%97.md)\n  - [JS 中的类型转换](Javascript%2FJS%E4%B8%AD%E7%9A%84%E7%B1%BB%E5%9E%8B%E8%BD%AC%E6%8D%A2.md)\n  - [JS 中的精度问题](Javascript%2FJS%E4%B8%AD%E7%9A%84%E7%B2%BE%E5%BA%A6%E9%97%AE%E9%A2%98.md)\n  - [JS 代码手写题](Javascript%2FJS%E4%BB%A3%E7%A0%81%E6%89%8B%E5%86%99%E9%A2%98.md)\n  - [JS 实现多条件排序](Javascript%2FJS%E5%AE%9E%E7%8E%B0%E5%A4%9A%E6%9D%A1%E4%BB%B6%E6%8E%92%E5%BA%8F.md)\n  - [JS 正则表达式速查笔记](Javascript%2FJS%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E9%80%9F%E6%9F%A5%E7%AC%94%E8%AE%B0.md)\n  - [Set 和 Map](Javascript%2FSet%E5%92%8CMap.md)\n  - [keydown, input,change,compsition 事件的区别](Javascript%2Fkeydown%2C%20input%2Cchange%2Ccompsition%E4%BA%8B%E4%BB%B6%E7%9A%84%E5%8C%BA%E5%88%AB.md)\n  - [koa 源码学习笔记](Javascript%2Fkoa%E6%BA%90%E7%A0%81%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0.md)\n  - [selection 与 range](Javascript%2Fselection%E4%B8%8Erange.md)\n  - [ts 学习笔记](Javascript%2Fts%E5%AD%A6%E4%B9%A0%E7%AC%94%E8%AE%B0.md)\n  - [一文理解 JS 中的继承](Javascript%2F%E4%B8%80%E6%96%87%E7%90%86%E8%A7%A3JS%E4%B8%AD%E7%9A%84%E7%BB%A7%E6%89%BF.md)\n  - [前端国际化中的 RTL 适配](Javascript%2F%E5%89%8D%E7%AB%AF%E5%9B%BD%E9%99%85%E5%8C%96%E4%B8%AD%E7%9A%84RTL%E9%80%82%E9%85%8D.md)\n  - [前端埋点](Javascript%2F%E5%89%8D%E7%AB%AF%E5%9F%8B%E7%82%B9.md)\n  - [前端异常处理](Javascript%2F%E5%89%8D%E7%AB%AF%E5%BC%82%E5%B8%B8%E5%A4%84%E7%90%86.md)\n  - [前端截图](Javascript%2F%E5%89%8D%E7%AB%AF%E6%88%AA%E5%9B%BE.md)\n  - [剪贴板操作](Javascript%2F%E5%89%AA%E8%B4%B4%E6%9D%BF%E6%93%8D%E4%BD%9C.md)\n  - [如何在页面卸载前发送请求](Javascript%2F%E5%A6%82%E4%BD%95%E5%9C%A8%E9%A1%B5%E9%9D%A2%E5%8D%B8%E8%BD%BD%E5%89%8D%E5%8F%91%E9%80%81%E8%AF%B7%E6%B1%82.md)\n  - [控制反转与依赖注入](Javascript%2F%E6%8E%A7%E5%88%B6%E5%8F%8D%E8%BD%AC%E4%B8%8E%E4%BE%9D%E8%B5%96%E6%B3%A8%E5%85%A5.md)\n  - [理解 base64](Javascript%2F%E7%90%86%E8%A7%A3base64.md)\n  - [策略模式](Javascript%2F%E7%AD%96%E7%95%A5%E6%A8%A1%E5%BC%8F.md)\n- HTML_CSS\n  - [0-css 面试题汇总](HTML_CSS%2F0-css%E9%9D%A2%E8%AF%95%E9%A2%98%E6%B1%87%E6%80%BB.md)\n  - [css 中有关用户行为的 user-xx](HTML_CSS%2Fcss%E4%B8%AD%E6%9C%89%E5%85%B3%E7%94%A8%E6%88%B7%E8%A1%8C%E4%B8%BA%E7%9A%84user-xx.md)\n  - [css 中的层叠,权重与继承](HTML_CSS%2Fcss%E4%B8%AD%E7%9A%84%E5%B1%82%E5%8F%A0%2C%E6%9D%83%E9%87%8D%E4%B8%8E%E7%BB%A7%E6%89%BF.md)\n  - [css 中的方位与顺序](HTML_CSS%2Fcss%E4%B8%AD%E7%9A%84%E6%96%B9%E4%BD%8D%E4%B8%8E%E9%A1%BA%E5%BA%8F.md)\n  - [css 中的线性渐变](HTML_CSS%2Fcss%E4%B8%AD%E7%9A%84%E7%BA%BF%E6%80%A7%E6%B8%90%E5%8F%98.md)\n  - [css 实现元素尺寸比例保持不变](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E5%85%83%E7%B4%A0%E5%B0%BA%E5%AF%B8%E6%AF%94%E4%BE%8B%E4%BF%9D%E6%8C%81%E4%B8%8D%E5%8F%98.md)\n  - [css 实现半椭圆效果](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E5%8D%8A%E6%A4%AD%E5%9C%86%E6%95%88%E6%9E%9C.md)\n  - [css 实现平行四边形效果](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E5%B9%B3%E8%A1%8C%E5%9B%9B%E8%BE%B9%E5%BD%A2%E6%95%88%E6%9E%9C.md)\n  - [css 实现灵活的 footer 效果](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E7%81%B5%E6%B4%BB%E7%9A%84footer%E6%95%88%E6%9E%9C.md)\n  - [css 实现等高布局](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E7%AD%89%E9%AB%98%E5%B8%83%E5%B1%80.md)\n  - [css 实现遮罩效果的几种方式](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E9%81%AE%E7%BD%A9%E6%95%88%E6%9E%9C%E7%9A%84%E5%87%A0%E7%A7%8D%E6%96%B9%E5%BC%8F.md)\n  - [css 实现饼图效果](HTML_CSS%2Fcss%E5%AE%9E%E7%8E%B0%E9%A5%BC%E5%9B%BE%E6%95%88%E6%9E%9C.md)\n  - [css 径向渐变](HTML_CSS%2Fcss%E5%BE%84%E5%90%91%E6%B8%90%E5%8F%98.md)\n  - [flex 与 margin auto 为何能实现水平居中效果](HTML_CSS%2Fflex%E4%B8%8Emargin%20auto%E4%B8%BA%E4%BD%95%E8%83%BD%E5%AE%9E%E7%8E%B0%E6%B0%B4%E5%B9%B3%E5%B1%85%E4%B8%AD%E6%95%88%E6%9E%9C.md)\n  - [line-height 和 vertical-align 实现多行文字水平垂直居中效果](HTML_CSS%2Fline-height%E5%92%8Cvertical-align%E5%AE%9E%E7%8E%B0%E5%A4%9A%E8%A1%8C%E6%96%87%E5%AD%97%E6%B0%B4%E5%B9%B3%E5%9E%82%E7%9B%B4%E5%B1%85%E4%B8%AD%E6%95%88%E6%9E%9C.md)\n  - [zIndex 管理](HTML_CSS%2FzIndex%E7%AE%A1%E7%90%86.md)\n  - [你不知道的 margin](HTML_CSS%2F%E4%BD%A0%E4%B8%8D%E7%9F%A5%E9%81%93%E7%9A%84margin.md)\n  - [关于设备自适应需要知道知识(DPI,PPI,分辨率,屏幕尺寸)](\u003cHTML_CSS%2F%E5%85%B3%E4%BA%8E%E8%AE%BE%E5%A4%87%E8%87%AA%E9%80%82%E5%BA%94%E9%9C%80%E8%A6%81%E7%9F%A5%E9%81%93%E7%9F%A5%E8%AF%86(DPI%2CPPI%2C%E5%88%86%E8%BE%A8%E7%8E%87%2C%E5%B1%8F%E5%B9%95%E5%B0%BA%E5%AF%B8).md\u003e)\n  - [子元素 transform 后父元素依然占据空间](HTML_CSS%2F%E5%AD%90%E5%85%83%E7%B4%A0transform%E5%90%8E%E7%88%B6%E5%85%83%E7%B4%A0%E4%BE%9D%E7%84%B6%E5%8D%A0%E6%8D%AE%E7%A9%BA%E9%97%B4.md)\n  - [实现一个按钮相关的单行布局效果](HTML_CSS%2F%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E6%8C%89%E9%92%AE%E7%9B%B8%E5%85%B3%E7%9A%84%E5%8D%95%E8%A1%8C%E5%B8%83%E5%B1%80%E6%95%88%E6%9E%9C.md)\n  - [文字布局基础](HTML_CSS%2F%E6%96%87%E5%AD%97%E5%B8%83%E5%B1%80%E5%9F%BA%E7%A1%80.md)\n- React 源码\n  - [React 和 Vue 对比](React%E6%BA%90%E7%A0%81%2FReact%E5%92%8CVue%E5%AF%B9%E6%AF%94.md)\n  - [diff 算法](React%E6%BA%90%E7%A0%81%2Fdiff%E7%AE%97%E6%B3%95.md)\n  - fiber\n    - [react 中的 fiber 架构](React%E6%BA%90%E7%A0%81%2Ffiber%2Freact%E4%B8%AD%E7%9A%84fiber%E6%9E%B6%E6%9E%84.md)\n  - scheduler\n    - [任务调度的基本原理](React%E6%BA%90%E7%A0%81%2Fscheduler%2F%E4%BB%BB%E5%8A%A1%E8%B0%83%E5%BA%A6%E7%9A%84%E5%9F%BA%E6%9C%AC%E5%8E%9F%E7%90%86.md)\n  - 合成事件\n    - [React 合成事件](React%E6%BA%90%E7%A0%81%2F%E5%90%88%E6%88%90%E4%BA%8B%E4%BB%B6%2FReact%E5%90%88%E6%88%90%E4%BA%8B%E4%BB%B6.md)\n    - [实现 React 合成事件](React%E6%BA%90%E7%A0%81%2F%E5%90%88%E6%88%90%E4%BA%8B%E4%BB%B6%2F%E5%AE%9E%E7%8E%B0React%E5%90%88%E6%88%90%E4%BA%8B%E4%BB%B6.md)\n- React 相关\n  - [React Hook 实战-封装 Audio](React%E7%9B%B8%E5%85%B3%2FReact%20Hook%E5%AE%9E%E6%88%98-%E5%B0%81%E8%A3%85Audio.md)\n  - [React-dev-inspector 的工作原理](React%E7%9B%B8%E5%85%B3%2FReact-dev-inspector%E7%9A%84%E5%B7%A5%E4%BD%9C%E5%8E%9F%E7%90%86.md)\n  - [React 为 Modal 添加国际化文案](React%E7%9B%B8%E5%85%B3%2FReact%E4%B8%BAModal%E6%B7%BB%E5%8A%A0%E5%9B%BD%E9%99%85%E5%8C%96%E6%96%87%E6%A1%88.md)\n  - [i18n-automation-with-react-intl](React%E7%9B%B8%E5%85%B3%2Fi18n-automation-with-react-intl.md)\n  - [如何实现文字超出隐藏 hover 出现 tooltip 的效果](React%E7%9B%B8%E5%85%B3%2F%E5%A6%82%E4%BD%95%E5%AE%9E%E7%8E%B0%E6%96%87%E5%AD%97%E8%B6%85%E5%87%BA%E9%9A%90%E8%97%8Fhover%E5%87%BA%E7%8E%B0tooltip%E7%9A%84%E6%95%88%E6%9E%9C.md)\n  - [如何实现路由中间件](React%E7%9B%B8%E5%85%B3%2F%E5%A6%82%E4%BD%95%E5%AE%9E%E7%8E%B0%E8%B7%AF%E7%94%B1%E4%B8%AD%E9%97%B4%E4%BB%B6.md)\n  - [实现 react-router](React%E7%9B%B8%E5%85%B3%2F%E5%AE%9E%E7%8E%B0react-router.md)\n  - [实现一个简易的 redux](React%E7%9B%B8%E5%85%B3%2F%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E7%AE%80%E6%98%93%E7%9A%84redux.md)\n  - [组件设计](React%E7%9B%B8%E5%85%B3%2F%E7%BB%84%E4%BB%B6%E8%AE%BE%E8%AE%A1.md)\n  - [通过 CDN 使用 React](React%E7%9B%B8%E5%85%B3%2F%E9%80%9A%E8%BF%87CDN%E4%BD%BF%E7%94%A8React.md)\n- Vue\n  - [Vue Compiler 的运行机制](Vue%2FVue%20Compiler%E7%9A%84%E8%BF%90%E8%A1%8C%E6%9C%BA%E5%88%B6.md)\n  - [实现 Vue-tiny-diff 算法](Vue%2F%E5%AE%9E%E7%8E%B0Vue-tiny-diff%E7%AE%97%E6%B3%95.md)\n  - [实现 Vue-tiny-数据响应式](Vue%2F%E5%AE%9E%E7%8E%B0Vue-tiny-%E6%95%B0%E6%8D%AE%E5%93%8D%E5%BA%94%E5%BC%8F.md)\n- 工具\\_效率\n  - [ChatGPT 初体验](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2FChatGPT%E5%88%9D%E4%BD%93%E9%AA%8C.md)\n  - [Circleci 机器人自动部署 storybook 到 GitHub](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2FCircleci%E6%9C%BA%E5%99%A8%E4%BA%BA%E8%87%AA%E5%8A%A8%E9%83%A8%E7%BD%B2storybook%E5%88%B0GitHub.md)\n  - [Github](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2FGithub.md)\n  - [acme.sh 生成 https 证书](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2Facme.sh%E7%94%9F%E6%88%90https%E8%AF%81%E4%B9%A6.md)\n  - [clash 配置指南](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2Fclash%E9%85%8D%E7%BD%AE%E6%8C%87%E5%8D%97.md)\n  - [iterms2-antigen-to-improve-your-work-experience](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2Fiterms2-antigen-to-improve-your-work-experience.md)\n  - [prettier-eslint-vscode-实现前端代码格式化](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2Fprettier-eslint-vscode-%E5%AE%9E%E7%8E%B0%E5%89%8D%E7%AB%AF%E4%BB%A3%E7%A0%81%E6%A0%BC%E5%BC%8F%E5%8C%96.md)\n  - [windows 配置](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2Fwindows%E9%85%8D%E7%BD%AE.md)\n  - [修改 cursor 机器 ID](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E4%BF%AE%E6%94%B9cursor%E6%9C%BA%E5%99%A8ID.md)\n  - [在 vscode 上进行 markdown 写作](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%9C%A8vscode%E4%B8%8A%E8%BF%9B%E8%A1%8Cmarkdown%E5%86%99%E4%BD%9C.md)\n  - [在 vscode 中快速调试你的前端项目](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%9C%A8vscode%E4%B8%AD%E5%BF%AB%E9%80%9F%E8%B0%83%E8%AF%95%E4%BD%A0%E7%9A%84%E5%89%8D%E7%AB%AF%E9%A1%B9%E7%9B%AE.md)\n  - [如何在线预览 github 的 html 页面](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%A6%82%E4%BD%95%E5%9C%A8%E7%BA%BF%E9%A2%84%E8%A7%88github%E7%9A%84html%E9%A1%B5%E9%9D%A2.md)\n  - [常用 git 命令](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%B8%B8%E7%94%A8git%E5%91%BD%E4%BB%A4.md)\n  - [常用的 shell 命令](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%B8%B8%E7%94%A8%E7%9A%84shell%E5%91%BD%E4%BB%A4.md)\n  - [开发常用的效率工具(Mac)](\u003c%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E5%BC%80%E5%8F%91%E5%B8%B8%E7%94%A8%E7%9A%84%E6%95%88%E7%8E%87%E5%B7%A5%E5%85%B7(Mac).md\u003e)\n  - [环境变量](%E5%B7%A5%E5%85%B7_%E6%95%88%E7%8E%87%2F%E7%8E%AF%E5%A2%83%E5%8F%98%E9%87%8F.md)\n- 跨端开发\n  - [chrome 插件开发踩坑汇总](%E8%B7%A8%E7%AB%AF%E5%BC%80%E5%8F%91%2Fchrome%E6%8F%92%E4%BB%B6%E5%BC%80%E5%8F%91%E8%B8%A9%E5%9D%91%E6%B1%87%E6%80%BB.md)\n  - [uniapp 微信 H5 开发本地调试方案](%E8%B7%A8%E7%AB%AF%E5%BC%80%E5%8F%91%2Funiapp%E5%BE%AE%E4%BF%A1H5%E5%BC%80%E5%8F%91%E6%9C%AC%E5%9C%B0%E8%B0%83%E8%AF%95%E6%96%B9%E6%A1%88.md)\n  - [web 唤起 app](%E8%B7%A8%E7%AB%AF%E5%BC%80%E5%8F%91%2Fweb%E5%94%A4%E8%B5%B7app.md)\n- 程序人生\n  - [(译)提升你的逆向工程技能](\u003c%E7%A8%8B%E5%BA%8F%E4%BA%BA%E7%94%9F%2F(%E8%AF%91)%E6%8F%90%E5%8D%87%E4%BD%A0%E7%9A%84%E9%80%86%E5%90%91%E5%B7%A5%E7%A8%8B%E6%8A%80%E8%83%BD.md\u003e)\n  - [西班牙 ISE2024 之行](%E7%A8%8B%E5%BA%8F%E4%BA%BA%E7%94%9F%2F%E8%A5%BF%E7%8F%AD%E7%89%99ISE2024%E4%B9%8B%E8%A1%8C.md)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchenxiaoyao6228%2Ffe-notes","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchenxiaoyao6228%2Ffe-notes","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchenxiaoyao6228%2Ffe-notes/lists"}