前端
双方的范围
PHP程序员,web前端程序员
展开
-
web网站前端性能优化(三)
使用响应式图片 如果你关心你的网站的表现,响应图像很重要。图片通常是网站有效负载中最大的一部分。尽管互联网连接速度在不断提高,但许多设备都配备了高分辨率显示器。为了使图像在这些设备上最佳地显示,需要更高分辨率的图像。但是,因为您仍然需要支持屏幕分辨率较差的设备,所以您仍然需要较低分辨率的图像,并且必须注意将图像传递到各种设备的方式。 当您考虑图像传输时,其目的不仅是为了提供最好的视觉体验,而且还要提供适合设备功能的图像。知道如何正确地使用图片,可以确保性能较差的设备不会承受超出其需求的负担,同时确保性能最好原创 2020-08-26 19:12:00 · 167 阅读 · 0 评论 -
web网站前端性能优化(二)css优化
#CSS优化 使用缩写的css样式规则 使用简短的CSS样式规则会减少样式文件的大小。这种方法在短期内不会为您节省很多,但是如果在大型样式表中使用,那么它可以起到很大的作用。所以养成使用简短样式规则是个好习惯。 div { /*使用简短样式规则*/ border: 1px solid red; margin: 1px 2px 3px 4px; } div { border-left: 1px solid red; border-right: 1px solid re原创 2020-08-06 18:15:25 · 157 阅读 · 0 评论 -
web网站前端性能优化(一)
了解你的网站 为了优化一个网站,你必须能够识别出需要改进的地方。这意味着要分析页面上的请求数量、页面包含的数据量以及页面加载所花费的时间。这就是开发者工具派上用场的地方。您将学习如何使用这些工具创建瀑布图,以及如何量化客户网站的各个方面,以便您有一个优化的起点。 下面来看一下chrome的开发者工具: 记录按钮必须处于启用状态(红色),然后您才能生成一个请求瀑布图。还应该选中Disable Cache复选框,以便在重新加载页面时不进行缓存。 ##查看请求的时间信息 ###TTFB (TTFB),即从用户请原创 2020-08-06 18:13:44 · 179 阅读 · 0 评论 -
如何构建一个响应式网站
什么是响应式web网站 以前我写网的网页习惯的网页都是定宽的,比如最外层设置一个宽度为980px的盒子,这是因为那时候的网页主要显示在pc端上,而pc端显示器的大小差异不会特别大。于是固定宽度的样式写法成为了流行趋势。但是随着移动互联网的到来,设备类型的增多,如智能手机,平板。那么屏幕大小的差异也就凸显出来了,如果每一个屏幕设备宽度写一个样式的话,会发现存在大量重复的样式代码,且工作量会很大,于是我们需要一种减少重复样式,让样式能够自动适应屏幕的解决方案就出来了:“响应式”。 我们知道不同的设备拥有不同屏幕原创 2020-08-06 18:12:20 · 1274 阅读 · 0 评论