互联网有一项著名的8秒规则，用户在访问web页面的时候，如果时间超过了8秒就会感觉到不耐烦，如果加载需要太长的时间，他们就会放弃访问。向网页开发者表明了加载时间的重要性
1.资源合并和压缩：主要包括有html压缩，css压缩，js的压缩和混乱文件的合并
从文件中去除多余的字符，例如回车，空格等。
css代码的压缩：是无效代码删除和css语义合并
js的压缩和混乱：1.无效字符的删除 2.删除注释 3代码语义的缩减和优化 4.代码的保护
css和js的压缩是非常有必要的,压缩合并css和js可以减少网站http请求的次数，但合并文件可能会带来问题：首屏渲染和缓存失效问题
2.非核心代码进行异步加载。
异步加载的3种方式-async和defer。动态脚本的创建1
<script src = "text/javascript" src = "xxx.js" async = "async">
defer是在html解析完之后才会执行，如果是多个，则会按照加载的顺序依次执行，
async是在加载完之后立即执行，如果是多个，执行顺序和加载顺序无关
3.利用浏览器缓存
3.1利用前缓存 不会向服务器发送请求 直接从缓存中读取资源
3.2利用协商缓存 向服务器发送请求，服务器会根据request header中的一些参数来判断是否命中协商缓存
强缓存优先于协商缓存,若强制缓存生效则直接使用缓存。若不生效则使用协商缓存。
用户行为对浏览器缓存的影响
1.地址栏访问，链接跳转是正常用户行为，将会触发浏览器的缓存机制
2.F5刷新，浏览器会设置max-age = 0,跳过强缓存判断，会进行协商缓存判断。
3.ctrl + F5,跳过强缓存和协商缓存，直接从服务器获取数据
4.使用CDN
浏览器的缓存只是为了提高二次访问的速度需要从网络层面进行优化，最常见的是CDN(内容分发网络),通过将静态资源(js,css,html图片)等缓存到离用户很近的相同网络运营商的CDN节点上，不但提高用户的访问速度，还能节省服务器的带宽消耗，降低负载。
CDN服务商在全国各个省份部署计算节点，当到达计算节点时，首先判断缓存是否有效，若有效，则立即响应缓存给用户，否则，就去内容服务器上请求数据，反馈给用户，并将内容缓存下来以便响应给后续访问的用户。
一个地区内只要有一个用户预先加载资源，在CDN中建立了缓存，该地区中的其余用户便会因此而受益
5.
预解析DNS 使用该技术预先告知浏览器某些资源可能会在将来被使用，
通过DNS预解析告诉浏览器我们未来可能从某个特定的URL获取资源，当浏览器真正使用的时候，就可以尽快完成DNS的解析。1
<link rel = "dns-prefetch" href = "//example.com">
懒加载也叫延迟加载，指的是在长网页中延迟加载图像，是一种很好用的性能优化方式,，
用户滚动到它们之前，可视区域外的图像不会加载,
使用延迟加载使得网页加载更快
为什么使用懒加载：1.能提升用户体验。2.减少无效资源的加载 3.防止并发加载的资源过多会阻塞js的加载。
预加载：另一个性能优化技术，告知浏览器某些资源可能会在未来使用到，
预加载把所有资源提前加载到本地，这样后面要使用的话就直接从缓存中读取。
懒加载和预加载的对比，
两者主要区别是一个是提前加载，一个是迟缓甚至不加载，懒加载对服务器端有一定的缓解压力作用，预加载则会增加服务器端压力。
函数防抖和节流
函数节流(throttle)：一个函数执行一次后，只有大于设定的执行周期后才会执行第二次。
有个需要频繁触发的函数，出于性能优化，在规定时间内，只让函数触发一次。
判断当前时间戳和上次执行的时间戳是否已经达到规定时间段。
函数节流：
1.DOM元素的拖拽功能，计算鼠标移动，射击游戏的mousedown/keydown.
函数防抖(debounce)：
防抖函数：一个需要频繁触发的函数，在规定时间内，只让最后一次生效即可，前面的不生效
常见的攻击和防御方法
xss(跨站脚本攻击)，通过存在安全漏洞的web网站注册用户的浏览器内运行非法的html标签或者js进行攻击
1.利用虚假输入表单获取信息
2.利用脚本窃取用户的cookie值。被害者在不知情的情况下，帮助攻击者发送恶意请求。
3.显示伪造的文章或者图片
防御XSS攻击：
CSP建立白名单，开发者明确告诉浏览器哪些外部资源可以加载
通过设置http header1
content-security-policy:defalut-src 'self'
通过使用转移字符
3.httpOnly cookie
预防xss攻击的最有效手段 设置httpOnly,避免网页的cookie被客户端恶意js获取，保护用户的cookie信息
2.csrf攻击：
在登录a的情况下已经设置好cookie,所以在登录恶意网站时，将a网站上的cookie信息获取。
防范：get请求不对数据进行修改，不让第三方网站访问到用户的cookie.阻止第三方网站请求接口，请求时必须携带验证信息，例如cookie
3.点击劫持：视觉欺骗的攻击手段，攻击者将需要攻击的网站通过iframe嵌套到自己的网页中，并将iframe设置为透明，在页面中透出一个按钮诱导用户点击，特点：隐蔽性较高，UI-覆盖点击，利用iframe或者其他标签的属性。
4.URL跳转漏洞：借助未验证的URL进行跳转，将应用程序引导到不安全的第三方区域，从而导致安全问题。
5.SQL注入，一种典型的web安全漏洞，攻击者利用这个漏洞，可以访问或者修改数据，或者利用潜在的数据库漏洞进行攻击。
6.OS命令注入攻击：和SQL注入差不多，SQL注入是针对数据库的，而OS注入是针对操作系统的。OS命令注入攻击指的是通过Web应用，执行非法的操作系统命令而达到攻击的目的，只要在能调用shell函数的地方就能存在被攻击的风险。防御：进行规则限制，
在调用系统命令前将所有传入参数进行命令行参数转义过滤。不要直接拼接命令语句，借助一些工具作拼接。，例如 Node.js 的 shell-escape npm包