存储
约 830 字大约 3 分钟
2021-03-07
浏览器存储
哪些操作会造成内存泄露？
内存泄露是指一块被分配的内存既不能使用，又不能回收，直到浏览器进程结束。
以下几点回造成内存泄露：
- 过量使用闭包导致父函数中的变量无法被释放引起内存泄露（解决：将事件处理函数定义在外部，解除闭包，或者在定义事件处理函数的外部函数中，删除对dom的引用；
- 控制台日志（解决：项目完成后记得删除多余的控制台打印）；
- 循环，也就是两个对象彼此引用且彼此保留；
- 定时器未被正确关闭，导致所引用的外部变量无法被释放。setTimeout的第一个参数是字符串而不是函数的时候也会造成内存泄露（解决：尽量不要将第一个参数定义为字符串）；
- 意外的全局变量也会引起内存泄漏（解决：使用严格模式避免）。
- 没有清理DOM元素（解决： 手动删除）；
- 事件监听没有正确销毁(低版本浏览器可能出现)
可用Chrome中的timeline进行内存标记，可视化查看内存的变化情况，找出异常点
HTML5的离线储存怎么使用？工作原理是什么？
在用户没有与因特网连接时，可以正常访问站点或应用，在用户与因特网连接时，更新用户机器上的缓存文件
原理
HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术)，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时，浏览器会通过被离线存储的数据进行页面展示
使用
- 页面头部像下面一样加入一个manifest的属性；
- 在cache.manifest文件的编写离线存储的资源
- 在离线状态时，操作window.applicationCache进行需求实现
CACHE
MANIFEST#v0.11CACHE:js/app.jscss/style.cssNETWORK:resourse/logo.pngFALLBACK:/ /offline.html浏览器是怎么对HTML5的离线储存资源进行管理和加载的？
在线的情况下：
浏览器发现html头部有manifest属性，它会请求manifest文件，如果是第一次访问app，那么浏览器就会根据manifest文件的内容下载相应的资源并且进行离线存储。如果已经访问过app并且资源已经离线存储了，那么浏览器就会使用离线的资源加载页面，然后浏览器会对比新的manifest文件与旧的manifest文件，如果文件没有发生改变，就不做任何操作，如果文件改变了，那么就会重新下载文件中的资源并进行离线存储。
离线的情况下：
浏览器就直接使用离线存储的资源。
为什么利用多个域名来存储网站资源会更有效？
- CDN缓存更方便
- 突破浏览器并发限制
- 节约cookie带宽
- 节约主域名的连接数，优化页面响应速度
- 防止不必要的安全问题