xx_yan的博客

width和device-width width和height指浏览器视区的尺寸，可以通过document.documentElement.clientWidth;获取。 而device-width和device-height指显示器的尺寸，可以通过window.screen.width。 不是每个人都会全屏运行他或她的浏览器，但是移动浏览器将填满可用的屏幕。 默认情况下，现代移动设备会缩放网页来...

资源组织方式 合并css和js文件 一个项目只有一个css，一个js，使得不同网页不必每次请求重复的css或者js内容。 并且使用打包工具可以压缩资源文件的大小，例如webpack、gulp、grunt等。 优先使用矢量图 使用字体图表或者SVG图替代传统的PNG图片。 矢量图片资源大小更小，渲染速度快，不存在放大后模糊的问题。 减少冗余 CSS的性能优于js；原生js的性能优于第三方插件。 避免...

浏览器请求至展示页面的流程 DNS查询 TCP连接 HTTP请求 服务器响应 客户端渲染 客户端渲染流程 解析html => 构建DOM树 解析css + DOM树 => 构建render树 布局render树 (重排layout / reflow) = 计算元素大小、位置 绘制render树 (重绘paint） = 绘制页面像素 发送页面信息给GPU绘制 GPU合成各层页面 =...

Javascript 实现 javascript : 为了与网页交互而设计的语言 组成部分 1. ECMAScript 语言标准的规定，包括： 语法 + 类型 + 语句 + 关键字 + 保留字 + 操作符 + 对象 javascript 实现了 ECMAScript 2. DOM 文档对象模型 document object model 提供访问和操作网页内容的方法和接口 针对 xml 但是经过扩...