您好,欢迎来到12图资源库!分享精神,快乐你我!我们只是素材的搬运工!!
  • 首 页
  • 当前位置:首页 > 网站教程 > SEO教程 >
    网站大提速之一阅读器渲染速度优化
    时间:2017-10-13 15:04 来源:网络整理 作者:网络 浏览:收藏 挑错 推荐 打印

    要完成网站的大提速,必须在各个环节停止准确的设置和放置。网站一旦翻开速度变慢,往常,站长们第一时间一定会以为“效劳器慢”,其实看完本章后,你会发现或许结果并不完全是这样。影响网站速度的要素千差万别,效劳器仅是其中一小部分要素而已。

    有一种常见的状况,异样的效劳器,网站与网站之间的翻开速度也千差万别,这就和网站的制造工艺有相当大的关系;本节重点讲一下网站制造工艺优化。

    我们可以大致将影响网络速度的要素分为五个来停止辨别优化:

    一、效劳器硬件配置和设置;

    二、效劳器的线路及带宽;

    三、用户电脑的配置和设置;

    四、用户的线路及带宽;

    五、网站制造工艺。

    我们看到,影响网速的要素大约是这五个部分,而往往很多时分,效劳器、用户的电脑配置和线路属性是无法选择的,所以我们这篇文章不细谈带宽和效劳器硬件方面的成绩。重点谈一下经过网站制造工艺的优化来到达网站极限提速的办法和思绪,这其中是很多站长往常完全疏忽的。

    当然,顺序设计不当也会形成网页速度变慢。但是顺序设计的种类和运转环境千差万别,形成的缘由也十分复杂,本章也无法逐一叙说。我的网站泸州网采用的DZ X2作为网站引擎,由于顺序设计时设计者也没有充沛思索到阅读器的渲染,所以依然不完全契合下面的优化项目。但假设你采用的是HTML静态生成的CMS,比如DEDECMS等,就可以完全参照下面的优化项目来实施。

    一 阅读器的渲染速度优化:

    首先要说的是,阅读器的渲染很多无法经过直观的实验来证明,只能推断和察看结果来纠正和处置,所以,我总结的办法,未必全部契合实践原理。

    我们学习CSS,一末尾只考究完成结果,从未留意过CSS的渲染进程,这就形成了很多不必要的渲染糜费。在没有任何顺序影响下的页面,假设出现网站翻开卡、翻开后机器变慢、翻开进程中显示了内容却又变白屏再读一遍、点击不顺畅、上下左右拖动花屏,重渲染的主要缘由。

    1.CSS,一定要写在<head ></head >之间,让阅读器先缓存到一切CSS,也便于阅读器读取HTML结构时可以顺利渲染,假设在<body ></body >之间出现了CSS样式定义,阅读器会重新渲染一遍网页。影响到网页翻开速度;

    至于是<body >内出现了重定义样式才重新渲染,还是一旦出现样式定义就重新渲染,目前我也没有办法证明。但应尽量避免这种状况。

    2.当页面文档中少量出现需求展开、收起的树形结构(树形目录)的时分,最容易出现CSS渲染成绩。我们所说的展开、收起,其实是网页元素的显示和隐藏,由于某些阅读器设计缺陷,展开一个隐藏的元素,实践上消耗很大,缘由能够是display:none并没有真正隐藏元素,很能够即使是隐藏层,但该元素属性依然需求逐一渲染。

    这种状况,普通多见于树形目录过多过于复杂的时分出现,点击一次半天不展开,机器出现缓慢。

    3.和同上的状况一样,border:0这种属性,依然会渲染边框样式。所以正确的写法应该是:border:none,避免有意义的渲染;

    4.JS也能够会形成重渲染,所以我们应尽量整合JS,并将一切JS放置到页末之前。假设我没记错,即使JS在页头,现代阅读器大多都会默许最后加载JS;

    5.一切图片必须指定高宽属性,否则阅读器也会重新渲染网页。试想,阅读器在不知道图片高宽的状况下,阅读器无法为图片在页面上预留详细位置,而此时HTML和CSS样式也在同时下载。阅读器显然无法有效组织显示结果,只要当图片完全下载后才能确定图片的高宽,势必形成阅读器的重新渲染;

    6.背景图过小也会形成渲染困难。我们想象一下,将一个1px高宽的背景图作为背景填充溢整个屏幕,需求停止多少次计算处置。所以,我们以前学的“图片尽量小”,其实是有误区存在的;

    7.尽量少用帧数过多过快的FLASH,GIF动画来装饰网页。这对网页翻开速度简直是致命的;

    8.少用滤镜,滤镜会占用更多的机器资源,也能够存在很多兼容性成绩。应慎重运用;

    9.尽量少用TABLE结构来规划。由于用FW\PS可以很方便的直接导出一个网页文件,所以老式网站都是采用TABLE规划。TABLE有一个广受诟病的成绩:之后要遇到才会残缺显示内容。假设表格中内容过多,网页会半天不显示。这也是TABLE规划被淘汰的缘由之一;

    10.CSS子选择符。CSS子选择符会形成一次阅读器的挑选和定位计算,所以很多文章上都不引荐运用子选择符定位样式。能用.div 的,就尽量不要用.nav ul li a .div 这样的写法。

    关于阅读器的渲染优化,目前我所了解到的就这些。下一章将会为大家效劳器减压的几种主要办法:包括图片格式引见及运用和紧缩办法;Css sprite的实践运用;效劳器GZIP设置;增加效劳器央求数的几种引见。

    希望广告高手指正、补充!

    宣布请保留: 泸州网夜上原创。

    (责任编辑:admin)