随笔- 137 文章- 0 评论- 1 阅读- 92736

随笔分类 - H5开发

摘要：懒加载和预加载的目的都是为了提高用户的体验，二者行为是相反的，一个是延迟加载，另一个是提前加载。懒加载对缓解服务器压力有一定作用，预加载则会增长服务器前端压力缓存。一、懒加载lazyload 懒加载：又叫延迟加载、按需加载，当我们打开一个网页，优先展示的首屏图片就先加载，而其他的图片，等到需要去展阅读全文

posted @ 2025-02-18 21:59 时光独醒阅读(44) 评论(0) 推荐(0) 编辑

前端性能优化方案

摘要：‌前端性能优化方案‌主要包括以下几个方面：‌ 1. 页面渲染优化 ‌减少重绘和回流‌：尽量减少使用CSS属性的快捷方式，使用transform、filter、will-change等属性来触发GPU硬件加速，避免使用table布局，使用DocumentFragment进行批量创建DOM节点。 ‌图像阅读全文

posted @ 2025-02-18 18:28 时光独醒阅读(18) 评论(0) 推荐(0) 编辑

在浏览器地址栏中输入一个URL，按下回车后会经历哪些流程

摘要：在浏览器地址栏键入URL，按下回车之后会经历以下流程： 1、浏览器向 DNS 服务器请求解析该 URL 中的域名所对应的 IP 地址; 2、解析出 IP 地址后，根据该 IP 地址和默认端口 80，和服务器建立TCP连接; 3、浏览器发出读取文件(URL中域名后面部分对应的文件)的HTTP请求，该请阅读全文

posted @ 2025-02-18 18:24 时光独醒阅读(4) 评论(0) 推荐(0) 编辑

HTTP的协商缓存和强制缓存

摘要：Web缓存机制主要分为两种类型：强制缓存和协商缓存。这两种缓存机制分别在不同的条件下发挥作用，共同确保了资源的有效缓存和更新。一、强制缓存强缓存就是本地缓存浏览器首次请求资源后，需要再次请求时，浏览器会首先获取该资源缓存的header信息，然后根据Cache-Control和expires 阅读全文

posted @ 2025-02-18 18:17 时光独醒阅读(10) 评论(0) 推荐(0) 编辑

重排和重绘的区别

摘要：‌重排（Reflow）和重绘（Repaint）是浏览器渲染页面时涉及的两个重要概念，它们的主要区别在于触发条件、性能影响以及对页面布局的影响。定义和触发条件 ‌重排（Reflow）‌：当页面的布局发生变化，如元素的位置、大小或隐藏/显示状态改变时，浏览器需要重新计算页面的布局。这个过程称为重排。重阅读全文

posted @ 2025-02-18 18:00 时光独醒阅读(16) 评论(0) 推荐(0) 编辑

移动H5调试神器 vConsole

摘要：在真机环境下调试移动端H5的时候，无法像浏览器一样打开控制台进行console调试，那么我们可以在前端项目中引入vconsole，便于我们在真机环境下调试移动端H5项目 vConsole是一个轻量、可拓展、针对手机网页的前端开发者调试面板。详细文档可查看：https://gitee.com/mir 阅读全文

posted @ 2023-06-12 17:03 时光独醒阅读(1252) 评论(0) 推荐(0) 编辑

css选择器优先级

摘要：css选择器优先级不同级别： 1.在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。2.作为style属性写在元素内的样式3.id选择器4.类选择器5.标签选择器6.通配符选择器7.浏览器自定义或继承同一级别：同一级别中后写的会覆盖先写的样式总结排序：!importa 阅读全文

posted @ 2022-04-27 10:57 时光独醒阅读(0) 评论(0) 推荐(0) 编辑

H5页面跳转

摘要：一、H5跳转 1.在本窗体打开一个新的页面； window.location.href = url; 2.在一个新的窗口打开一个新的页面； window.open(url); 3.本窗口的页面被替换为一个新的页面URL，替换后不可以回退到上个页面； window.location.replace(u 阅读全文

posted @ 2022-04-26 17:44 时光独醒阅读(28) 评论(0) 推荐(0) 编辑