一个网站的诞生 MagicDict开发总结8 [页面优化 能省一点是一点]

首先祝大家端午节快乐。

由于网站的配置灰常不好,所以有一段时间,首页的访问都很慢。原来以为是首页的东西太多了,(后来才知道是数据库出问题了)所以想方设法的优化首页。

方法一:能放在其他地方的资源,就放在其他地方,大网站不在乎我这点资源。

    首页上的图片,背景图片,找个可靠的论坛,比如博客园,放在个人的相册里面,然后,<img src> 里面直接写上相册地址就OK了。以后下载图片直接从大网站下载,虽然这样做不厚道,不过大网站不在乎这点微不足道的流量。。不过,有些论坛的图片不允许外部访问[图片盗链],所以这个方法使用前,先测试一下。Jquery这样的东西,倒是可以名正言顺的使用Jquery官网的资源,好像官网也欢迎这么做。。。。这个方法,只有在很极端的情况下才考虑使用,属于下三烂的手法[我承认,我用过]。

方法二:如果使用了ASPX的控件的话,每个控件会产生一个WebResource.axd的东西。

关于这个压缩,网上资料满天飞了:

WebResourceCompression压缩模块


     这个压缩模块是专门用来实时压缩ASP.NET2.0页面引用的所有*.axd资源,一般aspx页面使用了如anthem.net的ajax框架或 asp.net验证控件都会产生axd文件引用,这个文件实际就是一个js脚本,启用这个压缩模块后,所有的axd资源都会被GZIP压缩后再传送给客户端,此模块特别适用于aspx页面应用了ajax框架或需引用体积庞大的axd资源文件的项目!

使用:解压后将WebResourceCompression.dll放到项目的BIN目录,并且在Web.config <httpModules> 配置节中加入以下语句:
<add name="WebResourceCompression" type="WebResourceCompression.WebResourceCompressionModule"/>

优点:使用简单
缺点:仅支持ASP.NET2.0或以上版本,不能压缩除axd外的其它资源!

WebResourceCompression.dll下载地址:https://files.cnblogs.com/aspxcn/WebResourceCompression.zip

当然,最根本的方法是,不用任何ASPX的控件,或者少用控件。输入框,按钮,都使用纯HTML,自己写Post方法。老手当然可以这样,只会拖拖控件的小朋友。。。。现在 magicDict 没有使用任何ASPX的控件。

 <form id="form1" method='post' action='' defaultbutton='btnJP2CN' onsubmit='return checkSubmit()'>

<input type="submit" class="buttonNormal" id="btnJP2CN" value="检索" />

当然说到了压缩,还有一个好伙伴一定要介绍的,他的压缩范围是这个页面,效果灰常明显啊,大爱。

给个关键字 Compression.PageCompressionModule.dll  用这个Google一下,你想要的压缩的介绍文章,什么都有了。

这些DLL使用起来也很方便,直接放在BIN下面,万事OK了。。。。给力。

方法三:把JS尽量放在页面的底部。

    为什么这么做?

         理由1:JS在下载的时候,会将其他的资源下载都停下来,所以,这个家伙还是放在最后下载吧。[道听途说的,如果不对,请大侠指出,以免误人子弟]

         理由2:用户能够先看到页面的内容,比如文字图片,就不会觉得网页下载慢了。JS的功能,可能不是一下子就用得上的。如果先下载JS,用户看到一个空白页面,会抓狂的啊。。。。用户伤不起啊伤不起。

方法四:把小图片整合成一张图片,然后使用指定左上角的坐标的方法来偏移图片,使其能够表示你想要让用户看的部分。

    每个小图片都一个个下载,对于服务器来说可不是一个有趣的事情。把这些图片放在一起,一次性的下载下来,然后按照需要表示其不同的部分,也是一个好的方法。

Google关键字 css sprites

网页优化的 奇巧淫技 还有很多很多,有些东西,不使用不知道的。如果不是因为当初网站实在慢的不行了,估计不会去研究这些东西的。上面列出来的只是我使用过的方法,不足的地方,请大家补充。。。。第一次制作网站,边做边学习啊。。


 

 网站第二阶段研发开始了,懂日语的童鞋,能和我一起做吗?

有兴趣的写信给我 root#magicdict.com   [convert # to @ ]

或者加MSN mynightelfplayer@hotmail.com

网站地址 http://www.magicdict.com/

原文地址:https://www.cnblogs.com/TextEditor/p/2072716.html