From 10553439514c4d5a26fc6621d01f89d309d114c6 Mon Sep 17 00:00:00 2001 From: qianguyihao Date: Sat, 10 Apr 2021 11:03:41 +0800 Subject: [PATCH] =?UTF-8?q?update:=20=E7=9B=AE=E5=BD=95=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 3 + ...网络抓包.md => 网络抓包和代理工具：Whistle.md} | 47 ++++- .../00-前言.md | 0 .../01-性能优化的指标和工具.md | 0 .../02-浏览器渲染机制.md | 0 13-前端性能优化/03-渲染优化.md | 169 ++++++++++++++++++ .../lazyload&防抖动和节流阀.md | 0 .../静态资源优化.md | 0 .../页面渲染性能优化.md | 0 13-前端面试/02-前端性能优化/02-渲染优化.md | 27 --- .../01-面试必看 => 14-前端面试}/00-准备.md | 0 .../01-面试必看 => 14-前端面试}/01-页面布局.md | 0 .../02-CSS盒模型及BFC.md | 0 .../03-DOM事件的总结.md | 0 .../01-面试必看 => 14-前端面试}/04-HTTP协议.md | 0 .../05-01.创建对象和原型链.md | 0 .../05-02.面向对象：类的定义和继承的几种方式.md | 0 .../01-面试必看 => 14-前端面试}/06-跨域通信类.md | 0 .../07-安全问题：CSRF和XSS.md | 0 .../01-面试必看 => 14-前端面试}/08-算法问题.md | 0 .../09-js运行机制：异步和单线程.md | 0 .../10-页面性能优化.md | 0 .../11-前端错误监控.md | 0 .../20180116-博客园：一年经验初探阿里巴巴前端社招.md | 0 .../面试题积累}/ES6.md | 0 .../面试题积累}/ES6：模块化的使用和编译环境.md | 0 .../面试题积累}/JS相关.md | 0 .../面试题积累}/JavaScript高级面试：前言.md | 0 .../面试题积累}/MVVM.md | 0 .../面试题积累}/http.md | 0 .../面试题积累}/z-web安全.md | 0 .../面试题积累}/z-其他.md | 0 .../面试题积累}/z-推荐文章.md | 0 .../面试题积累}/z-计算机网络.md | 0 .../面试题积累}/函数.md | 0 .../面试题积累}/变量提升的题目.md | 0 .../面试题积累}/异步.md | 0 .../面试题积累}/我的面试经历 by 千古壹号.md | 0 .../面试题积累}/清单.md | 0 .../面试题积累}/网友面经.md | 0 .../面试题积累}/虚拟DOM.md | 0 .../面试题积累}/面经链接推荐.md | 0 .../面试题积累}/面试技巧 by 千古壹号.md | 0 .../面试题积累}/面试题整理 by 千古壹号.md | 0 15-前端综合/网络抓包和代理工具：Whistle.md | 44 ----- .../01-前端代码规范.md | 0 .../02-前端常见专有名词.md | 0 .../02-数组的常见操作.md | 0 .../04-前端监控技术.md | 0 {14-前端进阶 => 15-前端进阶}/Vue开发积累.md | 0 .../前端的几道题目.md | 0 .../01-2019年Web前端入门自学路线.md | 0 .../2018年-前端日记.md | 0 .../2019年-前端日记.md | 0 .../2020年-前端日记.md | 0 {15-前端综合 => 16-前端综合}/CSS开发总结.md | 0 .../06-Express.md => 16-前端综合/Express.md | 0 {15-前端综合 => 16-前端综合}/ajax相关.md | 0 {15-前端综合 => 16-前端综合}/html相关.md | 0 .../json字符串的解析和遍历.md | 0 {15-前端综合 => 16-前端综合}/json相关.md | 0 .../前端分享群整理.md | 0 {15-前端综合 => 16-前端综合}/前端博客推荐.md | 0 {15-前端综合 => 16-前端综合}/前端开发积累.md | 0 {15-前端综合 => 16-前端综合}/前端语录.md | 0 .../网友对本项目提的建议.md | 0 .../01-2020年Web前端最新导航.md | 0 .../02-GitHub项目推荐.md | 0 {16-推荐链接 => 17-推荐链接}/03-网站推荐.md | 0 .../04-前端文章推荐.md | 0 {16-推荐链接 => 17-推荐链接}/2018-推荐文章.md | 0 {16-推荐链接 => 17-推荐链接}/2019-推荐文章.md | 0 {16-推荐链接 => 17-推荐链接}/2020-推荐文章.md | 0 .../上海有哪些IT互联网大厂.md | 0 .../北京有哪些IT互联网大厂.md | 0 .../深圳有哪些IT互联网大厂.md | 0 76 files changed, 214 insertions(+), 76 deletions(-) create mode 100644 .gitignore rename 00-前端工具/{whistle网络抓包.md => 网络抓包和代理工具：Whistle.md} (72%) rename {13-前端面试/02-前端性能优化 => 13-前端性能优化}/00-前言.md (100%) rename {13-前端面试/02-前端性能优化 => 13-前端性能优化}/01-性能优化的指标和工具.md (100%) rename 13-前端面试/01-面试必看/09-浏览器渲染机制.md => 13-前端性能优化/02-浏览器渲染机制.md (100%) create mode 100644 13-前端性能优化/03-渲染优化.md rename 14-前端进阶/09-lazyload&防抖动和节流阀.md => 13-前端性能优化/lazyload&防抖动和节流阀.md (100%) rename {13-前端面试/02-前端性能优化 => 13-前端性能优化}/静态资源优化.md (100%) rename {13-前端面试/02-前端性能优化 => 13-前端性能优化}/页面渲染性能优化.md (100%) delete mode 100644 13-前端面试/02-前端性能优化/02-渲染优化.md rename {13-前端面试/01-面试必看 => 14-前端面试}/00-准备.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/01-页面布局.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/02-CSS盒模型及BFC.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/03-DOM事件的总结.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/04-HTTP协议.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/05-01.创建对象和原型链.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/05-02.面向对象：类的定义和继承的几种方式.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/06-跨域通信类.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/07-安全问题：CSRF和XSS.md (100%) rename {13-前端面试/01-面试必看 => 14-前端面试}/08-算法问题.md (100%) rename 13-前端面试/01-面试必看/10-js运行机制：异步和单线程.md => 14-前端面试/09-js运行机制：异步和单线程.md (100%) rename 13-前端面试/01-面试必看/11-页面性能优化.md => 14-前端面试/10-页面性能优化.md (100%) rename 13-前端面试/01-面试必看/12-前端错误监控.md => 14-前端面试/11-前端错误监控.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/20180116-博客园：一年经验初探阿里巴巴前端社招.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/ES6.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/ES6：模块化的使用和编译环境.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/JS相关.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/JavaScript高级面试：前言.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/MVVM.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/http.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/z-web安全.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/z-其他.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/z-推荐文章.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/z-计算机网络.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/函数.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/变量提升的题目.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/异步.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/我的面试经历 by 千古壹号.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/清单.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/网友面经.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/虚拟DOM.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/面经链接推荐.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/面试技巧 by 千古壹号.md (100%) rename {13-前端面试/03-面试题积累 => 14-前端面试/面试题积累}/面试题整理 by 千古壹号.md (100%) delete mode 100644 15-前端综合/网络抓包和代理工具：Whistle.md rename {14-前端进阶 => 15-前端进阶}/01-前端代码规范.md (100%) rename {14-前端进阶 => 15-前端进阶}/02-前端常见专有名词.md (100%) rename {14-前端进阶 => 15-前端进阶}/02-数组的常见操作.md (100%) rename {14-前端进阶 => 15-前端进阶}/04-前端监控技术.md (100%) rename {14-前端进阶 => 15-前端进阶}/Vue开发积累.md (100%) rename {14-前端进阶 => 15-前端进阶}/前端的几道题目.md (100%) rename {15-前端综合 => 16-前端综合}/01-2019年Web前端入门自学路线.md (100%) rename {15-前端综合 => 16-前端综合}/2018年-前端日记.md (100%) rename {15-前端综合 => 16-前端综合}/2019年-前端日记.md (100%) rename 15-前端综合/2020-前端日记.md => 16-前端综合/2020年-前端日记.md (100%) rename {15-前端综合 => 16-前端综合}/CSS开发总结.md (100%) rename 15-前端综合/06-Express.md => 16-前端综合/Express.md (100%) rename {15-前端综合 => 16-前端综合}/ajax相关.md (100%) rename {15-前端综合 => 16-前端综合}/html相关.md (100%) rename {15-前端综合 => 16-前端综合}/json字符串的解析和遍历.md (100%) rename {15-前端综合 => 16-前端综合}/json相关.md (100%) rename 15-前端综合/03-前端学习分享（微信群）.md => 16-前端综合/前端分享群整理.md (100%) rename {15-前端综合 => 16-前端综合}/前端博客推荐.md (100%) rename {15-前端综合 => 16-前端综合}/前端开发积累.md (100%) rename {15-前端综合 => 16-前端综合}/前端语录.md (100%) rename {15-前端综合 => 16-前端综合}/网友对本项目提的建议.md (100%) rename {16-推荐链接 => 17-推荐链接}/01-2020年Web前端最新导航.md (100%) rename {16-推荐链接 => 17-推荐链接}/02-GitHub项目推荐.md (100%) rename {16-推荐链接 => 17-推荐链接}/03-网站推荐.md (100%) rename {16-推荐链接 => 17-推荐链接}/04-前端文章推荐.md (100%) rename {16-推荐链接 => 17-推荐链接}/2018-推荐文章.md (100%) rename {16-推荐链接 => 17-推荐链接}/2019-推荐文章.md (100%) rename {16-推荐链接 => 17-推荐链接}/2020-推荐文章.md (100%) rename {16-推荐链接 => 17-推荐链接}/上海有哪些IT互联网大厂.md (100%) rename {16-推荐链接 => 17-推荐链接}/北京有哪些IT互联网大厂.md (100%) rename {16-推荐链接 => 17-推荐链接}/深圳有哪些IT互联网大厂.md (100%) diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e23f045 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +.vscode +.DS_Store +images \ No newline at end of file diff --git a/00-前端工具/whistle网络抓包.md b/00-前端工具/网络抓包和代理工具：Whistle.md similarity index 72% rename from 00-前端工具/whistle网络抓包.md rename to 00-前端工具/网络抓包和代理工具：Whistle.md index 7063fef..1ab0dde 100644 --- a/00-前端工具/whistle网络抓包.md +++ b/00-前端工具/网络抓包和代理工具：Whistle.md @@ -1,13 +1,52 @@ -## 手机设置代理 +## Whistle 官网 + +- Whistle 官网： + +- Whistle 的 GitHub： + + +## Whistle 安装启动 + +### 1、Whistle 安装 + + +（1）通过 npm 安装 Whistle + + +### 2、启动 whistle + +```bash +w2 start +``` + +然后在浏览器输入`http://127.0.0.1:8899/` 即可打开代理配置的页面。 + + +### 3、配置代理 + +**chrome浏览器配置代理**： + +暂略。 + +**Firefox浏览器配置代理**： + +![](../img/20200420_1357.png) + + +### 4、安装证书并添加信任： + +![](../img/20200420_0922.png) + + +### 手机设置代理 连接好指定的wifi后，点击那个wifi里的设置，将「代理」那一项，设置为手动，然后输入ip（电脑上的ip）、端口号（8899）。然后就可以通过电脑上的whistle工具，查看手机的网页请求。 注意，要保证手机和电脑在同一个网络下。 - ## 捕获和拦截https请求 @@ -20,7 +59,6 @@ whistle安装证书后，可以拦截 https 请求。但是，我现在又不想 上图中，把红框部分，去掉勾选，就不捕获https了。谢谢azh童鞋。 - 参考链接： - [Android 手机如何设置http代理？](https://www.zhihu.com/question/21474174) @@ -28,7 +66,6 @@ whistle安装证书后，可以拦截 https 请求。但是，我现在又不想 - [使用 Whistle 对 iOS HTTPS 进行抓包](http://zhuscat.com/2017/09/20/https-proxy-on-ios/) - ## 移动端调试神器:eruda @@ -42,7 +79,6 @@ whistle安装证书后，可以拦截 https 请求。但是，我现在又不想 http://xxx.com htmlAppend://{eruda.html} ``` - (2)新建一个values，里面的内容是： ```html @@ -55,3 +91,4 @@ http://xxx.com htmlAppend://{eruda.html} 然后就OK了。 + diff --git a/13-前端面试/02-前端性能优化/00-前言.md b/13-前端性能优化/00-前言.md similarity index 100% rename from 13-前端面试/02-前端性能优化/00-前言.md rename to 13-前端性能优化/00-前言.md diff --git a/13-前端面试/02-前端性能优化/01-性能优化的指标和工具.md b/13-前端性能优化/01-性能优化的指标和工具.md similarity index 100% rename from 13-前端面试/02-前端性能优化/01-性能优化的指标和工具.md rename to 13-前端性能优化/01-性能优化的指标和工具.md diff --git a/13-前端面试/01-面试必看/09-浏览器渲染机制.md b/13-前端性能优化/02-浏览器渲染机制.md similarity index 100% rename from 13-前端面试/01-面试必看/09-浏览器渲染机制.md rename to 13-前端性能优化/02-浏览器渲染机制.md diff --git a/13-前端性能优化/03-渲染优化.md b/13-前端性能优化/03-渲染优化.md new file mode 100644 index 0000000..18b5c43 --- /dev/null +++ b/13-前端性能优化/03-渲染优化.md @@ -0,0 +1,169 @@ + + +## 浏览器的渲染机制 + +我们需要先理解浏览器的渲染经历了哪些过程，才能有针对性的进行相关优化。 + +掌握浏览器的渲染优化，可以说是前端工程师的一个分水岭。如果想要具备架构师的思维，需要达到什么样的能力？不光是要解决当下的问题，还需要掌握基本的原理，将来在遇到新问题时也能解决，即“预测问题”。 + +有一个经典的面试题是：“在浏览器的地址栏输入url，回车后，经历了哪些过程？”这个问题并不简单，根据你回答的详细程度，可以看出你对前后端知识的掌握程度。你能否答出“浏览器的渲染机制”？如果不能，说明你对浏览器渲染的性能优化，不够了解。 + +关于浏览器的渲染机制，可以看本教程的另外一篇文章： + +> 《前端面试/面试必看/浏览器渲染机制.md》 + + + +关键渲染路径举例： + + + +![image-20210323184157879](images/image-20210323184157879.png) + + + +![image-20210323184551245](images/image-20210323184551245.png) + + + + + + +## 避免布局抖动（layout thrashing） + +1、尽量避免 重排： + +比如说，如果想改变一个元素的位置，很多人可能会使用相对布局的left、top属性，但是这个属性会引起重排。我们可以使用 `transfrom:translate`让元素做位移，这个属性既不会触发重排，也不会触发 重绘，只会触发 conmposite。 + +再比如说，vue、react这样的框架，采用了虚拟DOM，它会把涉及到DOM修改的操作积攒起来，然后统一计算，批量处理，最后应用到真正的DOM上。 + +2、读写分离。建议先批量读（获取位置等信息），然后再批量做写操作（修改位置）。 + +补充： + +如果你的页面经常需要做重排、重绘，就很容易导致“页面抖动”。 + +很多时候，我们知道原理和解决方案。但是在工程化实践的时候，往往时间很紧，没有时间去做这些事情。我们希望有一些拿来就可以用的、而且经过测试没有问题的工具，来帮我们解决问题。 + +FastDom是用于做防抖的一个比较流行的解决方案。 + + + +## 减少重绘（repaint） + + + + + +## 防抖（Debounce）：降低事件的触发频率 + +我们可以针对**高频事件**做防抖。 + +**高频事件处理函数**：有很多事件的触发频率非常高，甚至超过了屏幕的刷新率（60帧/秒）。比如页面滚动、鼠标移动、移动端的touch事件。 + +如果我们不对这些事件做处理，就会频繁导致浏览器做重排、重绘，影响性能，导致页面卡顿，也就是“抖动”。因此需要对这些高频事件处理函数做防抖处理，降低它们的触发频率。 + +比如说滚动事件：我其实并不关心滚动中间的过程，我只关心最终滚动到了哪里。 + +requestAnimationFrame 这个api可以做防抖。 + + + + + +参考文章： + +- 防抖与节流：https://juejin.cn/post/6885250789825052679 + + + + + + + +## 代码优化 + + + +### JS的开销 + +静态资源有很多种：js、图片、css、字体等。这些资源都有可能会很大，但是JS的开销仍然是最昂贵的，因为JS除了加载资源之外，还需要经历**解析&编译**、**执行的**过程。 + + + + + + + +### 如何缩短JS的解析事件 + + + + + +### Web loading is a Journey + +![img](images/1*vSGOCrLV9MiLhpmPid1CHQ.png) + + + +### V8引擎 + + + + + + + +## 补充 + + + +- 首屏尽快打开，剩下的内容延迟加载，减少初次加载的资源量。首屏的内容是可以确定的。 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/14-前端进阶/09-lazyload&防抖动和节流阀.md b/13-前端性能优化/lazyload&防抖动和节流阀.md similarity index 100% rename from 14-前端进阶/09-lazyload&防抖动和节流阀.md rename to 13-前端性能优化/lazyload&防抖动和节流阀.md diff --git a/13-前端面试/02-前端性能优化/静态资源优化.md b/13-前端性能优化/静态资源优化.md similarity index 100% rename from 13-前端面试/02-前端性能优化/静态资源优化.md rename to 13-前端性能优化/静态资源优化.md diff --git a/13-前端面试/02-前端性能优化/页面渲染性能优化.md b/13-前端性能优化/页面渲染性能优化.md similarity index 100% rename from 13-前端面试/02-前端性能优化/页面渲染性能优化.md rename to 13-前端性能优化/页面渲染性能优化.md diff --git a/13-前端面试/02-前端性能优化/02-渲染优化.md b/13-前端面试/02-前端性能优化/02-渲染优化.md deleted file mode 100644 index af2c6ce..0000000 --- a/13-前端面试/02-前端性能优化/02-渲染优化.md +++ /dev/null @@ -1,27 +0,0 @@ - - -## 浏览器的渲染机制 - -我们需要先理解浏览器的渲染经历了哪些过程，才能有针对性的进行相关优化。 - -掌握浏览器的渲染优化，可以说是前端工程师的一个分水岭。如果想要具备架构师的思维，需要达到什么样的能力？不光是要解决当下的问题，还需要掌握基本的原理，将来在遇到新问题时也能解决，即“预测问题”。 - -有一个经典的面试题是：“在浏览器的地址栏输入url，回车后，经历了哪些过程？”这个问题并不简单，根据你回答的详细程度，可以看出你对前端知识的掌握程度。你能否答出“浏览器的渲染机制”？如果不能，说明你对浏览器渲染的性能优化，不够了解。 - -关于浏览器的渲染机制，可以看本教程的另外一篇文章： - -> 《前端面试/面试必看/浏览器渲染机制.md》 - - -## 避免布局抖动（layout thrashing） - -1、尽量避免 reflow： - -比如说，如果想改变一个元素的位置，很多人可能会使用相对布局的left、top属性，但是这个属性会引起 reflow。我们可以使用 `transfrom:translate`让元素做位移，这个属性既不会触发 reflow，也不会触发 repaint，只会触发 conmposite。 - -再比如说，vue、react这样的框架，采用了虚拟DOM，它会把涉及到DOM修改的操作积攒起来，然后统一计算，批量处理，最后应用到真正的DOM上。 - -2、读写分离。 -## 使用FastDom 做防抖 - - diff --git a/13-前端面试/01-面试必看/00-准备.md b/14-前端面试/00-准备.md similarity index 100% rename from 13-前端面试/01-面试必看/00-准备.md rename to 14-前端面试/00-准备.md diff --git a/13-前端面试/01-面试必看/01-页面布局.md b/14-前端面试/01-页面布局.md similarity index 100% rename from 13-前端面试/01-面试必看/01-页面布局.md rename to 14-前端面试/01-页面布局.md diff --git a/13-前端面试/01-面试必看/02-CSS盒模型及BFC.md b/14-前端面试/02-CSS盒模型及BFC.md similarity index 100% rename from 13-前端面试/01-面试必看/02-CSS盒模型及BFC.md rename to 14-前端面试/02-CSS盒模型及BFC.md diff --git a/13-前端面试/01-面试必看/03-DOM事件的总结.md b/14-前端面试/03-DOM事件的总结.md similarity index 100% rename from 13-前端面试/01-面试必看/03-DOM事件的总结.md rename to 14-前端面试/03-DOM事件的总结.md diff --git a/13-前端面试/01-面试必看/04-HTTP协议.md b/14-前端面试/04-HTTP协议.md similarity index 100% rename from 13-前端面试/01-面试必看/04-HTTP协议.md rename to 14-前端面试/04-HTTP协议.md diff --git a/13-前端面试/01-面试必看/05-01.创建对象和原型链.md b/14-前端面试/05-01.创建对象和原型链.md similarity index 100% rename from 13-前端面试/01-面试必看/05-01.创建对象和原型链.md rename to 14-前端面试/05-01.创建对象和原型链.md diff --git a/13-前端面试/01-面试必看/05-02.面向对象：类的定义和继承的几种方式.md b/14-前端面试/05-02.面向对象：类的定义和继承的几种方式.md similarity index 100% rename from 13-前端面试/01-面试必看/05-02.面向对象：类的定义和继承的几种方式.md rename to 14-前端面试/05-02.面向对象：类的定义和继承的几种方式.md diff --git a/13-前端面试/01-面试必看/06-跨域通信类.md b/14-前端面试/06-跨域通信类.md similarity index 100% rename from 13-前端面试/01-面试必看/06-跨域通信类.md rename to 14-前端面试/06-跨域通信类.md diff --git a/13-前端面试/01-面试必看/07-安全问题：CSRF和XSS.md b/14-前端面试/07-安全问题：CSRF和XSS.md similarity index 100% rename from 13-前端面试/01-面试必看/07-安全问题：CSRF和XSS.md rename to 14-前端面试/07-安全问题：CSRF和XSS.md diff --git a/13-前端面试/01-面试必看/08-算法问题.md b/14-前端面试/08-算法问题.md similarity index 100% rename from 13-前端面试/01-面试必看/08-算法问题.md rename to 14-前端面试/08-算法问题.md diff --git a/13-前端面试/01-面试必看/10-js运行机制：异步和单线程.md b/14-前端面试/09-js运行机制：异步和单线程.md similarity index 100% rename from 13-前端面试/01-面试必看/10-js运行机制：异步和单线程.md rename to 14-前端面试/09-js运行机制：异步和单线程.md diff --git a/13-前端面试/01-面试必看/11-页面性能优化.md b/14-前端面试/10-页面性能优化.md similarity index 100% rename from 13-前端面试/01-面试必看/11-页面性能优化.md rename to 14-前端面试/10-页面性能优化.md diff --git a/13-前端面试/01-面试必看/12-前端错误监控.md b/14-前端面试/11-前端错误监控.md similarity index 100% rename from 13-前端面试/01-面试必看/12-前端错误监控.md rename to 14-前端面试/11-前端错误监控.md diff --git a/13-前端面试/03-面试题积累/20180116-博客园：一年经验初探阿里巴巴前端社招.md b/14-前端面试/面试题积累/20180116-博客园：一年经验初探阿里巴巴前端社招.md similarity index 100% rename from 13-前端面试/03-面试题积累/20180116-博客园：一年经验初探阿里巴巴前端社招.md rename to 14-前端面试/面试题积累/20180116-博客园：一年经验初探阿里巴巴前端社招.md diff --git a/13-前端面试/03-面试题积累/ES6.md b/14-前端面试/面试题积累/ES6.md similarity index 100% rename from 13-前端面试/03-面试题积累/ES6.md rename to 14-前端面试/面试题积累/ES6.md diff --git a/13-前端面试/03-面试题积累/ES6：模块化的使用和编译环境.md b/14-前端面试/面试题积累/ES6：模块化的使用和编译环境.md similarity index 100% rename from 13-前端面试/03-面试题积累/ES6：模块化的使用和编译环境.md rename to 14-前端面试/面试题积累/ES6：模块化的使用和编译环境.md diff --git a/13-前端面试/03-面试题积累/JS相关.md b/14-前端面试/面试题积累/JS相关.md similarity index 100% rename from 13-前端面试/03-面试题积累/JS相关.md rename to 14-前端面试/面试题积累/JS相关.md diff --git a/13-前端面试/03-面试题积累/JavaScript高级面试：前言.md b/14-前端面试/面试题积累/JavaScript高级面试：前言.md similarity index 100% rename from 13-前端面试/03-面试题积累/JavaScript高级面试：前言.md rename to 14-前端面试/面试题积累/JavaScript高级面试：前言.md diff --git a/13-前端面试/03-面试题积累/MVVM.md b/14-前端面试/面试题积累/MVVM.md similarity index 100% rename from 13-前端面试/03-面试题积累/MVVM.md rename to 14-前端面试/面试题积累/MVVM.md diff --git a/13-前端面试/03-面试题积累/http.md b/14-前端面试/面试题积累/http.md similarity index 100% rename from 13-前端面试/03-面试题积累/http.md rename to 14-前端面试/面试题积累/http.md diff --git a/13-前端面试/03-面试题积累/z-web安全.md b/14-前端面试/面试题积累/z-web安全.md similarity index 100% rename from 13-前端面试/03-面试题积累/z-web安全.md rename to 14-前端面试/面试题积累/z-web安全.md diff --git a/13-前端面试/03-面试题积累/z-其他.md b/14-前端面试/面试题积累/z-其他.md similarity index 100% rename from 13-前端面试/03-面试题积累/z-其他.md rename to 14-前端面试/面试题积累/z-其他.md diff --git a/13-前端面试/03-面试题积累/z-推荐文章.md b/14-前端面试/面试题积累/z-推荐文章.md similarity index 100% rename from 13-前端面试/03-面试题积累/z-推荐文章.md rename to 14-前端面试/面试题积累/z-推荐文章.md diff --git a/13-前端面试/03-面试题积累/z-计算机网络.md b/14-前端面试/面试题积累/z-计算机网络.md similarity index 100% rename from 13-前端面试/03-面试题积累/z-计算机网络.md rename to 14-前端面试/面试题积累/z-计算机网络.md diff --git a/13-前端面试/03-面试题积累/函数.md b/14-前端面试/面试题积累/函数.md similarity index 100% rename from 13-前端面试/03-面试题积累/函数.md rename to 14-前端面试/面试题积累/函数.md diff --git a/13-前端面试/03-面试题积累/变量提升的题目.md b/14-前端面试/面试题积累/变量提升的题目.md similarity index 100% rename from 13-前端面试/03-面试题积累/变量提升的题目.md rename to 14-前端面试/面试题积累/变量提升的题目.md diff --git a/13-前端面试/03-面试题积累/异步.md b/14-前端面试/面试题积累/异步.md similarity index 100% rename from 13-前端面试/03-面试题积累/异步.md rename to 14-前端面试/面试题积累/异步.md diff --git a/13-前端面试/03-面试题积累/我的面试经历 by 千古壹号.md b/14-前端面试/面试题积累/我的面试经历 by 千古壹号.md similarity index 100% rename from 13-前端面试/03-面试题积累/我的面试经历 by 千古壹号.md rename to 14-前端面试/面试题积累/我的面试经历 by 千古壹号.md diff --git a/13-前端面试/03-面试题积累/清单.md b/14-前端面试/面试题积累/清单.md similarity index 100% rename from 13-前端面试/03-面试题积累/清单.md rename to 14-前端面试/面试题积累/清单.md diff --git a/13-前端面试/03-面试题积累/网友面经.md b/14-前端面试/面试题积累/网友面经.md similarity index 100% rename from 13-前端面试/03-面试题积累/网友面经.md rename to 14-前端面试/面试题积累/网友面经.md diff --git a/13-前端面试/03-面试题积累/虚拟DOM.md b/14-前端面试/面试题积累/虚拟DOM.md similarity index 100% rename from 13-前端面试/03-面试题积累/虚拟DOM.md rename to 14-前端面试/面试题积累/虚拟DOM.md diff --git a/13-前端面试/03-面试题积累/面经链接推荐.md b/14-前端面试/面试题积累/面经链接推荐.md similarity index 100% rename from 13-前端面试/03-面试题积累/面经链接推荐.md rename to 14-前端面试/面试题积累/面经链接推荐.md diff --git a/13-前端面试/03-面试题积累/面试技巧 by 千古壹号.md b/14-前端面试/面试题积累/面试技巧 by 千古壹号.md similarity index 100% rename from 13-前端面试/03-面试题积累/面试技巧 by 千古壹号.md rename to 14-前端面试/面试题积累/面试技巧 by 千古壹号.md diff --git a/13-前端面试/03-面试题积累/面试题整理 by 千古壹号.md b/14-前端面试/面试题积累/面试题整理 by 千古壹号.md similarity index 100% rename from 13-前端面试/03-面试题积累/面试题整理 by 千古壹号.md rename to 14-前端面试/面试题积累/面试题整理 by 千古壹号.md diff --git a/15-前端综合/网络抓包和代理工具：Whistle.md b/15-前端综合/网络抓包和代理工具：Whistle.md deleted file mode 100644 index 1328225..0000000 --- a/15-前端综合/网络抓包和代理工具：Whistle.md +++ /dev/null @@ -1,44 +0,0 @@ - - -## Whistle 官网 - -- Whistle 官网： - -- Whistle 的 GitHub： - - -## Whistle 安装启动 - -### 1、Whistle 安装 - - -（1）通过 npm 安装 Whistle - - -### 2、启动 whistle - -```bash -w2 start -``` - -然后在浏览器输入`http://127.0.0.1:8899/` 即可打开代理配置的页面。 - - -### 3、配置代理 - -**chrome浏览器配置代理**： - -暂略。 - -**Firefox浏览器配置代理**： - -![](../img/20200420_1357.png) - - -### 4、安装证书并添加信任： - -![](../img/20200420_0922.png) - - - - diff --git a/14-前端进阶/01-前端代码规范.md b/15-前端进阶/01-前端代码规范.md similarity index 100% rename from 14-前端进阶/01-前端代码规范.md rename to 15-前端进阶/01-前端代码规范.md diff --git a/14-前端进阶/02-前端常见专有名词.md b/15-前端进阶/02-前端常见专有名词.md similarity index 100% rename from 14-前端进阶/02-前端常见专有名词.md rename to 15-前端进阶/02-前端常见专有名词.md diff --git a/14-前端进阶/02-数组的常见操作.md b/15-前端进阶/02-数组的常见操作.md similarity index 100% rename from 14-前端进阶/02-数组的常见操作.md rename to 15-前端进阶/02-数组的常见操作.md diff --git a/14-前端进阶/04-前端监控技术.md b/15-前端进阶/04-前端监控技术.md similarity index 100% rename from 14-前端进阶/04-前端监控技术.md rename to 15-前端进阶/04-前端监控技术.md diff --git a/14-前端进阶/Vue开发积累.md b/15-前端进阶/Vue开发积累.md similarity index 100% rename from 14-前端进阶/Vue开发积累.md rename to 15-前端进阶/Vue开发积累.md diff --git a/14-前端进阶/前端的几道题目.md b/15-前端进阶/前端的几道题目.md similarity index 100% rename from 14-前端进阶/前端的几道题目.md rename to 15-前端进阶/前端的几道题目.md diff --git a/15-前端综合/01-2019年Web前端入门自学路线.md b/16-前端综合/01-2019年Web前端入门自学路线.md similarity index 100% rename from 15-前端综合/01-2019年Web前端入门自学路线.md rename to 16-前端综合/01-2019年Web前端入门自学路线.md diff --git a/15-前端综合/2018年-前端日记.md b/16-前端综合/2018年-前端日记.md similarity index 100% rename from 15-前端综合/2018年-前端日记.md rename to 16-前端综合/2018年-前端日记.md diff --git a/15-前端综合/2019年-前端日记.md b/16-前端综合/2019年-前端日记.md similarity index 100% rename from 15-前端综合/2019年-前端日记.md rename to 16-前端综合/2019年-前端日记.md diff --git a/15-前端综合/2020-前端日记.md b/16-前端综合/2020年-前端日记.md similarity index 100% rename from 15-前端综合/2020-前端日记.md rename to 16-前端综合/2020年-前端日记.md diff --git a/15-前端综合/CSS开发总结.md b/16-前端综合/CSS开发总结.md similarity index 100% rename from 15-前端综合/CSS开发总结.md rename to 16-前端综合/CSS开发总结.md diff --git a/15-前端综合/06-Express.md b/16-前端综合/Express.md similarity index 100% rename from 15-前端综合/06-Express.md rename to 16-前端综合/Express.md diff --git a/15-前端综合/ajax相关.md b/16-前端综合/ajax相关.md similarity index 100% rename from 15-前端综合/ajax相关.md rename to 16-前端综合/ajax相关.md diff --git a/15-前端综合/html相关.md b/16-前端综合/html相关.md similarity index 100% rename from 15-前端综合/html相关.md rename to 16-前端综合/html相关.md diff --git a/15-前端综合/json字符串的解析和遍历.md b/16-前端综合/json字符串的解析和遍历.md similarity index 100% rename from 15-前端综合/json字符串的解析和遍历.md rename to 16-前端综合/json字符串的解析和遍历.md diff --git a/15-前端综合/json相关.md b/16-前端综合/json相关.md similarity index 100% rename from 15-前端综合/json相关.md rename to 16-前端综合/json相关.md diff --git a/15-前端综合/03-前端学习分享（微信群）.md b/16-前端综合/前端分享群整理.md similarity index 100% rename from 15-前端综合/03-前端学习分享（微信群）.md rename to 16-前端综合/前端分享群整理.md diff --git a/15-前端综合/前端博客推荐.md b/16-前端综合/前端博客推荐.md similarity index 100% rename from 15-前端综合/前端博客推荐.md rename to 16-前端综合/前端博客推荐.md diff --git a/15-前端综合/前端开发积累.md b/16-前端综合/前端开发积累.md similarity index 100% rename from 15-前端综合/前端开发积累.md rename to 16-前端综合/前端开发积累.md diff --git a/15-前端综合/前端语录.md b/16-前端综合/前端语录.md similarity index 100% rename from 15-前端综合/前端语录.md rename to 16-前端综合/前端语录.md diff --git a/15-前端综合/网友对本项目提的建议.md b/16-前端综合/网友对本项目提的建议.md similarity index 100% rename from 15-前端综合/网友对本项目提的建议.md rename to 16-前端综合/网友对本项目提的建议.md diff --git a/16-推荐链接/01-2020年Web前端最新导航.md b/17-推荐链接/01-2020年Web前端最新导航.md similarity index 100% rename from 16-推荐链接/01-2020年Web前端最新导航.md rename to 17-推荐链接/01-2020年Web前端最新导航.md diff --git a/16-推荐链接/02-GitHub项目推荐.md b/17-推荐链接/02-GitHub项目推荐.md similarity index 100% rename from 16-推荐链接/02-GitHub项目推荐.md rename to 17-推荐链接/02-GitHub项目推荐.md diff --git a/16-推荐链接/03-网站推荐.md b/17-推荐链接/03-网站推荐.md similarity index 100% rename from 16-推荐链接/03-网站推荐.md rename to 17-推荐链接/03-网站推荐.md diff --git a/16-推荐链接/04-前端文章推荐.md b/17-推荐链接/04-前端文章推荐.md similarity index 100% rename from 16-推荐链接/04-前端文章推荐.md rename to 17-推荐链接/04-前端文章推荐.md diff --git a/16-推荐链接/2018-推荐文章.md b/17-推荐链接/2018-推荐文章.md similarity index 100% rename from 16-推荐链接/2018-推荐文章.md rename to 17-推荐链接/2018-推荐文章.md diff --git a/16-推荐链接/2019-推荐文章.md b/17-推荐链接/2019-推荐文章.md similarity index 100% rename from 16-推荐链接/2019-推荐文章.md rename to 17-推荐链接/2019-推荐文章.md diff --git a/16-推荐链接/2020-推荐文章.md b/17-推荐链接/2020-推荐文章.md similarity index 100% rename from 16-推荐链接/2020-推荐文章.md rename to 17-推荐链接/2020-推荐文章.md diff --git a/16-推荐链接/上海有哪些IT互联网大厂.md b/17-推荐链接/上海有哪些IT互联网大厂.md similarity index 100% rename from 16-推荐链接/上海有哪些IT互联网大厂.md rename to 17-推荐链接/上海有哪些IT互联网大厂.md diff --git a/16-推荐链接/北京有哪些IT互联网大厂.md b/17-推荐链接/北京有哪些IT互联网大厂.md similarity index 100% rename from 16-推荐链接/北京有哪些IT互联网大厂.md rename to 17-推荐链接/北京有哪些IT互联网大厂.md diff --git a/16-推荐链接/深圳有哪些IT互联网大厂.md b/17-推荐链接/深圳有哪些IT互联网大厂.md similarity index 100% rename from 16-推荐链接/深圳有哪些IT互联网大厂.md rename to 17-推荐链接/深圳有哪些IT互联网大厂.md