1.git:最常用的代码版本管理工具
常用git命令：
git add .
git checkout xxx
git commit -m "xxx"
git push origin master
git pull origin master
git branch
git checkout -b xxx/git checkout xxx
git merge xxx
chrom调试工具：
Elements,NetWork,Console,Application,debugger
抓包：
移动端h5页，查看网络请求，需要用工具抓包
windows一般用fiddler
MacOs一般用charles
需要将手机与电脑连接到一个局域网，将手机代理到电脑上，手机浏览网页即可抓包
运行环境：
页面加载过程
1）DNS解析：域名->IP地址
2）浏览器根据IP地址向服务器发起http请求
3）服务器处理http请求，并返回给浏览器
渲染过程：
1）根据html代码生产DomTree
2）根据Css代码生成CssOM
3）将DomTree 与 CssOM整合形成Render Tree
4）根据Render Tree渲染页面
5）遇到<script></script>停止渲染优先加载执行JS代码，完成再继续
6）直至RenderTree渲染完成
性能优化原则：
1）多使用内存，缓存或者其他办法
2）减少CPU计算量，减少网络加载耗时
3）空间换时间
加载优化：
1）减少资源体积：压缩代码
2）减少访问次数：合并代码，SSR服务器端渲染，缓存
SSR：
（1：服务器端渲染：将网页和数据一起加载，一起渲染
（2：非SSR：先加载网页，然后加载数据，再渲染数据
（3：早先的JSP,ASP,PHP,现在的vue,React SSR
3）使用更快的网络，CDN
渲染优化：
1）CSS放在Head,JS放在body最下面
2）尽早开始执行JS，用DomContentLoaded触发
3）懒加载
4）对dom查询进行缓存
5）频繁DOM操作，合并到一起插入DOM结构
6）防抖与节流
防抖：
function deboundce(fn,delay=500){
let timer = null
return function(){
if(timer){
clearTimeout(timer);
}
timer= setTimeout(()=>{
fn.apply(this,arguments);
timer=null;
},delay)
}
}
节流：
function deboundce(fn,delay=500){
let timer = null
return function(){
if(timer){
return;
}
timer= setTimeout(()=>{
fn.apply(this,arguments);
timer=null;
},delay)
}
}
网络攻击：
Xss攻击：
通过往页面文本内容嵌入<script>脚本，获取cookie（服务器配合跨域）
Xss预防：
替换特殊字符，如<变为<，>变为>前端后端同时替换
XSRF攻击：
通过电子邮件中正文内容隐藏的<img>标签隐藏的src进行信息盗取或商品代付
预防：
使用post接口
增加验证
标签：git,14,渲染,xxx,环境,timer,delay,面试,加载 From： https://www.cnblogs.com/qwqxyd/p/16759903.html