wlijun_0808的博客

在代码css中，我们经常为图像设置显示所需的长度像素值，但在不同的设备屏幕上，有时候相同的图像以及相同的设置，其渲染出来的图像，清晰度会有所差别，产生这个现象的原因涉及到两种不同的分辨率： 屏幕分辨率和图像分辨率。矢量图的缺点：对细节的展示效果不够丰富，对足够复杂的图像来说， 比如要达到照片的效果，若通过svg进行矢量图绘制，所的的文件就会大得离谱。10px ** 10px 的图像分辨率，既可以使用10px ***10px的屏幕来显示，也可以使用20px ** 20px 的屏幕显示。

网站 页面的整个生命周期，通俗的讲，就是从我们在浏览器的地址栏中输入一个url后，到整个页面渲染出来的过程，这个过程包括 域名解析，建立tcp连接，前后端通过http通话，压缩与解压缩，以及前端的关键渲染路径。如果都没有，就会去本地域名服务器上去查找，如果本地域名服务器没有对应的IP地址，那本地域名服务器会以迭代的方式去根域名服务器，com顶级域名服务器，权限域名服务器中去查找。当解析得到ip地址之后，就可以建立连接进行资源的请求与响应，主要走的是TCP/IP的一个网络模型。

特别是带有红色三角的位置，表示页面代码有性能问题，可以根据警告的文字 ，进行提升优化点。12， 勾选之后，会使用高级绘画工具，会详细记录某些渲染事件的细节。8，内存，勾选之后，会先区域3内显示页面加载中的一个性能展示模块。对于其他颜色的进程段，可以点击，下面就会显示这段进程的总时间。7，屏幕截图，勾选之后，会在区域2 显示页面每一帧的截图。3，调用树: 指的就是从开始到结束，执行的事件的排序。4，事件日志，就是展示每一个执行事件的时间信息。9，页面指标，勾选之后，可以展示页面的指标。