{"id":13603080,"url":"https://github.com/amandakelake/blog","last_synced_at":"2025-05-15T12:03:33.651Z","repository":{"id":40653296,"uuid":"119921062","full_name":"amandakelake/blog","owner":"amandakelake","description":"think more！learn more!","archived":false,"fork":false,"pushed_at":"2024-03-01T11:30:15.000Z","size":3904,"stargazers_count":2256,"open_issues_count":87,"forks_count":183,"subscribers_count":95,"default_branch":"master","last_synced_at":"2025-04-14T19:59:24.709Z","etag":null,"topics":["blog","browser","devops","docker","javascript","nodejs","react","vue","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/amandakelake.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":"2018-02-02T02:31:05.000Z","updated_at":"2025-04-04T06:45:25.000Z","dependencies_parsed_at":"2024-11-29T23:00:48.177Z","dependency_job_id":null,"html_url":"https://github.com/amandakelake/blog","commit_stats":{"total_commits":254,"total_committers":4,"mean_commits":63.5,"dds":"0.22440944881889768","last_synced_commit":"6dc64208b98a60c9a416dbfccf2082bdd516d262"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amandakelake%2Fblog","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amandakelake%2Fblog/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amandakelake%2Fblog/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/amandakelake%2Fblog/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/amandakelake","download_url":"https://codeload.github.com/amandakelake/blog/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254337612,"owners_count":22054253,"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":["blog","browser","devops","docker","javascript","nodejs","react","vue","webpack"],"created_at":"2024-08-01T18:01:48.617Z","updated_at":"2025-05-15T12:03:33.620Z","avatar_url":"https://github.com/amandakelake.png","language":"JavaScript","funding_links":[],"categories":["browser"],"sub_categories":[],"readme":"\n# personal blog\n\n\u003e 合抱之木，生于毫末；九层之台，起于累土；千里之行，始于足下 ————《老子》\n---\n\n[![Anurag's github stats](https://github-readme-stats.vercel.app/api?username=amandakelake)](https://github.com/anuraghazra/github-readme-stats)\n\n\n\n## Browser\n\n* [【浏览器原理-01】宏观下的浏览器](https://github.com/amandakelake/blog/blob/master/browser/browser-01.md)\n* [【浏览器原理-02】浏览器中的JS执行机制](https://github.com/amandakelake/blog/blob/master/browser/browser-02.md)\n* [【浏览器原理-03】V8 工作原理](https://github.com/amandakelake/blog/blob/master/browser/browser-03.md)\n* [【浏览器原理-04】页面循环系统](https://github.com/amandakelake/blog/blob/master/browser/browser-04.md)\n\n\n## Javascript\n* [【JS进阶】JS执行机制与核心概念(执行上下文、变量提升、作用域链、this)](https://github.com/amandakelake/blog/blob/master/javascript/core/JS%E6%89%A7%E8%A1%8C%E6%9C%BA%E5%88%B6.md)\n* [【JS进阶】垃圾回收、内存优化](https://github.com/amandakelake/blog/blob/master/javascript/core/%E5%9E%83%E5%9C%BE%E5%9B%9E%E6%94%B6.md)\n* [【异步-01】：Promise深入理解与实例分析](https://github.com/amandakelake/blog/issues/30)\n* [【异步-02】：Generator（生成器）深入理解](https://github.com/amandakelake/blog/issues/31)\n* [【异步-03】：Async/await](https://github.com/amandakelake/blog/issues/32)\n* [【设计模式】随手实现一个订阅-发布模式](https://github.com/amandakelake/blog/issues/65)\n* [【设计模式】代理模式+ES6 Proxy](https://github.com/amandakelake/blog/issues/67)\n* [【设计模式】装饰者模式+ES7 Decorator](https://github.com/amandakelake/blog/issues/66)\n* [【设计模式】单例模式](https://github.com/amandakelake/blog/issues/68)\n* [【JS基础】深入原型和原型链：彻底捋清prototype和__proto__](https://github.com/amandakelake/blog/issues/39)\n* [【JS基础】深入继承：一步步捋清五种继承方式](https://github.com/amandakelake/blog/issues/3)\n* [【JS基础】You don’t know JavaScript =\u003e 闭包](https://github.com/amandakelake/blog/issues/24)\n* [【JS基础】深入理解JS的类型、值、类型转换](https://github.com/amandakelake/blog/issues/34)\n* [【JS基础】从一道题说起（原型、this、作用域、构造函数、运算符优先级）](https://github.com/amandakelake/blog/issues/10)\n* [【JS基础】事件：捕获与冒泡、事件处理程序、事件对象、跨浏览器、事件委托](https://github.com/amandakelake/blog/issues/38)\n* [【JS基础】文件：读取/拖拽/预览、转换/上传/分割](https://github.com/amandakelake/blog/issues/40)\n* [【JS基础】模块化：CommonJS、AMD、CMD、UMD、ES6 Module](https://github.com/amandakelake/blog/blob/master/javascript/js-module.md)\n* [【JS API】ES6中export及export default、Node中exports和module.exports的区别](https://github.com/amandakelake/blog/issues/22)\n* [【JS API】map、forEach、filter 、reduce](https://github.com/amandakelake/blog/issues/19)\n* [【JS API】Object.defineProperty() 和简易双向绑定原理](https://github.com/amandakelake/blog/issues/8)\n* [【JS API】ECMAScript 2016 2017 2018 新特性](https://github.com/amandakelake/blog/issues/45)\n* [【handwriting】彻底捋清楚 instanceof ](https://github.com/amandakelake/blog/issues/36)\n* [【handwriting】彻底捋清楚 new 的实现](https://github.com/amandakelake/blog/issues/37)\n* [【handwriting】模拟实现call、apply、bind](https://github.com/amandakelake/blog/issues/16)\n* [【handwriting】根据Promise/A+规范实现 Promise](https://github.com/amandakelake/blog/issues/42)\n\n## Network、Web performance、Business Scenario\n\n* [浏览器工作原理：从输入URL到页面加载完成](https://github.com/amandakelake/blog/issues/55)\n* [事件循环机制 Event-Loop及其延伸](https://github.com/amandakelake/blog/issues/26)\n* [【性能优化】Web Performance Optimizations](https://github.com/amandakelake/blog/issues/64)\n* [【性能优化】DNS预解析、域名发散、域名收敛](https://github.com/amandakelake/blog/issues/50)\n* [【性能优化】优化关键渲染路径，加速浏览器首次渲染](https://github.com/amandakelake/blog/issues/54)\n* [【性能优化】手把手实现图片懒加载](https://github.com/amandakelake/blog/issues/46)\n* [【性能优化】图片优化——总览](https://github.com/amandakelake/blog/issues/48)\n* [【缓存-01】——缓存总览：从性能优化的角度看缓存](https://github.com/amandakelake/blog/issues/43)\n* [【缓存-02】——浏览器缓存机制：强缓存、协商缓存](https://github.com/amandakelake/blog/issues/41)\n* [【缓存-03】——数据存储：cookie、Storage、indexedDB](https://github.com/amandakelake/blog/issues/13)\n* [【缓存-04】——离线应用缓存：App Cache =\u003e Manifest](https://github.com/amandakelake/blog/issues/15)\n* [【网络】计算机网络总结：应用层、传输层、网络安全（多图预警）](https://github.com/amandakelake/blog/blob/master/network/network.md)\n* [【网络】深入了解HTTP/2及Web性能优化总结](https://github.com/amandakelake/blog/issues/35)\n* [【网络】GET和POST：辩证看100 continue](https://github.com/amandakelake/blog/issues/20)\n* [【网络】cookie实践（从搭建服务器到cookie操作全流程)](https://github.com/amandakelake/blog/issues/18)\n* [【网络】CORS 简单请求+预检请求（理解HTTP跨域原理）](https://github.com/amandakelake/blog/issues/62)\n* [【网络】前端跨域常用方法](https://github.com/amandakelake/blog/issues/17)\n* [canvas+vue实现60帧每秒的抢金币动画（类天猫红包雨）](https://github.com/amandakelake/blog/issues/70)\n* [canvas合成图片海报、分享，小坑记录](https://github.com/amandakelake/blog/issues/72)\n* [前端曝光数据埋点——IntersectionObserver+vue指令](https://github.com/amandakelake/blog/issues/71)\n* [Intersection Observer + Vue指令 优雅实现图片懒加载](https://github.com/amandakelake/blog/issues/73)\n\n\n## Framework\n\n* [【Vue】再读一次Vue2源码，彻底理解响应式系统](https://github.com/amandakelake/blog/blob/master/Framework/vue/vue2%E6%BA%90%E7%A0%81.md)\n* [【Vue】响应式原理](https://github.com/amandakelake/blog/issues/63)\n* [【Vue】VueJS 最佳实践【译】](https://github.com/amandakelake/blog/issues/69)\n* [【React】Next.js 生命周期理解](https://github.com/amandakelake/blog/issues/61)\n* [【React】Build a react+react-router ssr App from the ground up](https://github.com/amandakelake/react-router-ssr/blob/master/README.md)\n* [【React】SPA路由原理+build your own react router v4](https://github.com/amandakelake/blog/issues/53)\n* [【React】React Native 性能优化总结（持续更新。。。）](https://github.com/amandakelake/blog/issues/49)\n* [【React】React+RN开发过程中的一些问题总结（持续更新。。。）](https://github.com/amandakelake/blog/issues/52)\n* [【React】React-Native 从零搭建App(长文)](https://juejin.im/post/5a9f93d96fb9a028d2077c19)\n* [【React】源码分析：组件实现（基于版本16）](https://github.com/amandakelake/blog/issues/27)\n* [【React】源码分析：setState](https://github.com/amandakelake/blog/issues/29)\n* [【React】Redux源码分析](https://github.com/amandakelake/blog/issues/33)\n* [后端渲染、CSR、SSR的核心原理及区别](https://github.com/amandakelake/blog/issues/60)\n\n\n## Webpack、FE Engineering\n\n* [【webpack应用(一)】从零搭建vue开发环境](https://github.com/amandakelake/webpack-vue/blob/master/docs/dev.md)\n* [【webpack应用(二)】从零搭建vue生产环境](https://github.com/amandakelake/webpack-vue/blob/master/docs/prod.md)\n* [【webpack应用(三)】webpack性能优化](https://github.com/amandakelake/webpack-vue/blob/master/docs/optimize.md)\n* [【webpack进阶(一)】手撸一个mini-webpack(1) : 分析收集依赖](https://github.com/amandakelake/blog/issues/93)\n* [【webpack进阶(二)】手撸一个mini-webpack(2) : 打包依赖代码](https://github.com/amandakelake/blog/issues/98)\n* [【webpack进阶(三)】webpack插件骨架-Tapable](https://github.com/amandakelake/blog/issues/100)\n* [【webpack进阶(四)】webpack核心构建原理(vscode断点调试源码)](https://github.com/amandakelake/blog/issues/92)\n* [【webpack进阶(五)】构建module流程](https://github.com/amandakelake/blog/issues/99)\n* [【webpack进阶(六)】seal封装生成文件核心流程](https://github.com/amandakelake/blog/issues/101)\n* [【webpack进阶(七)】写个 plugin](https://github.com/amandakelake/blog/issues/91)\n* [【webpack进阶(八)】写个 loader](https://github.com/amandakelake/blog/issues/90)\n* [【规范】Eslint+Prettier+git hook -\u003e make your life easier](https://github.com/amandakelake/blog/issues/59)\n\n## Node、Server\n* [【NodeJS】部署高性能的Node服务](https://github.com/amandakelake/blog/blob/master/Node/%E9%83%A8%E7%BD%B2%E9%AB%98%E6%80%A7%E8%83%BD%E5%BA%94%E7%94%A8.md)\n* [【NodeJS】模块机制之require源码](https://github.com/amandakelake/blog/blob/master/Node/require.md)\n* [【NodeJS】多进程与多线程、cluster](https://github.com/amandakelake/blog/blob/master/Node/%E5%A4%9A%E8%BF%9B%E7%A8%8B%E4%B8%8E%E5%A4%9A%E7%BA%BF%E7%A8%8B.md)\n\n## DevOps、Linux\n* [【CI/CD】Travis、PM2、Vue SSR 自动化部署Node应用](https://github.com/amandakelake/blog/issues/104)\n* [【CI/CD】虚拟机搭建Jenkins+Docker+Github环境，实现自动部署](https://github.com/amandakelake/blog/blob/master/Engineering/cicd-jenkins.md)\n* [【CI/CD】Github Actions 浅尝 CI/CD](https://github.com/amandakelake/blog/blob/master/Engineering/github-actions.md)\n* [【Docker】快速入门](https://github.com/amandakelake/blog/blob/master/engineering/docker/docker%E5%9F%BA%E7%A1%80.md)\n* [【Docker】运行Node.js应用](https://github.com/amandakelake/blog/blob/master/engineering/docker/docker%E8%BF%90%E8%A1%8Cnode%E5%BA%94%E7%94%A8.md)\n* [【Docker】Docker+Docker-compose+Nginx镜像部署前端应用及优化](https://github.com/amandakelake/blog/blob/master/Engineering/deploy-01.md)\n* [【Kubernetes】集群搭建](https://github.com/amandakelake/blog/blob/master/Engineering/docker/k8s.md)\n* [【Kubernetes】ingress-nginx安装部署以及疑难杂症处理](https://github.com/amandakelake/blog/blob/master/Engineering/docker/ingress-nginx.md)\n* [【Linux基础】☁️服务器初始化安装与配置](https://github.com/amandakelake/blog/issues/102)\n* [【Linux基础】文件权限](https://github.com/amandakelake/blog/issues/103)\n* [【Linux基础】Vim 基础操作](https://github.com/amandakelake/blog/blob/master/Engineering/vim/vim%E5%9F%BA%E7%A1%80%E6%93%8D%E4%BD%9C.md)\n* [【Linux基础】cat + EOF 快速编辑文本](https://github.com/amandakelake/blog/blob/master/Engineering/linux/cat-EOF.md)\n* [【Linux基础】Virtualbox+Vagrant虚拟机管理 \u003e\u003e\u003e 榨干MacPro的32G内存](https://github.com/amandakelake/blog/blob/master/Engineering/vagrant.md)\n  \n\n## Algorithm\n\n* [《学习JavaScript数据结构与算法》读书笔记](https://github.com/amandakelake/blog/blob/master/Algorithm/Learn%20Javascript%20Data%20Structures%20and%20Algorithms/JS%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E4%B8%8E%E7%AE%97%E6%B3%95.pdf)\n* [JS实现基础数据结构(栈、队列、单双链表、二叉搜索树)](https://github.com/amandakelake/blog/blob/master/Algorithm/Learn%20Javascript%20Data%20Structures%20and%20Algorithms/js-data-structure.md)\n* [JS实现基础排序和搜索算法](https://github.com/amandakelake/blog/blob/master/Algorithm/Learn%20Javascript%20Data%20Structures%20and%20Algorithms/sort-search.md)\n\n## HTML、CSS\n\n* [BFC（块级格式上下文）](https://github.com/amandakelake/blog/issues/25)\n* [三栏布局-七种实现](https://github.com/amandakelake/blog/issues/28)\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famandakelake%2Fblog","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Famandakelake%2Fblog","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Famandakelake%2Fblog/lists"}