晋城吧对DiscuzX进行的前端优化要点


Posted in PHP onSeptember 05, 2010

最近,康盛的DX版本基本确定,至少短期内不会大变了,因此,我对晋城吧的整站进行了前端优化,把自己 所做的操作记录下来,一是有个记录,防止忘掉,二是和网上的朋友们共享下自己的心得。

前端优化 推荐工具

火狐浏览器+Yslow+google pagespeed+Firebug 具体下载地址 请自行百度

一、DX后台 及DIY的优化

1.首页DIY避免过多层的嵌套

DX的每一个框架都会产生非常多非常多非常多的 代码。我的首页已经尽可能简单了,结果光 DOM 有1600+,?逅牢伊恕?/P>

所以,尽可能不要用过多的框架嵌套

2.避免过多的用户头像调用

首页的会员调用是使用重定向的,会减慢网页的速度,UCenter倒是能改为伪静态,但是目前是有BUG的,没有自定义头像 的会员头像是无法显示的

3.打开Gzip

在网站后台 或者到config.php文件 将Gzip打开

4.背景图尽可能重复利用,减少背景图的数量

各个栏目的背景图尽可能一样,这样可以重复利用图片,要找到美观和速度之间的平衡,这一条,我其实也还在不断的尝试 中,这里推荐监控宝的服务器访 问速度跟踪,可以全局掌握自己网站被用户访问时的速度状况。

5.打开并设置好后台的各种优化和缓存

关于这方面的资料很多,我就不在这里浪费时间了,(被pia飞~~~)

二、代码 及空间优化

1.利用minify压缩合并js

DX的CSS 基本合并的很好,一个页面一到2个,但是JS就很多了。打开你的模板的common目录的header.htm,看到么。密密麻麻的js ,而过 多的文件会造成连接过多,减慢速度。

这里我们利用minify将其合并 压缩 缓存

首先,下载minify的压缩包,解压,将min文件夹上传到网站根目录。

然后修改2个文件:

1.min 文件夹下的groupsConfig.php

在上边的代码后边加上如下的代码

    'portal' => array('//static/js/common.js', '//static/js/home_friendselector.js', '//static/js/forum.js', '//static/js/portal.js'),               'forum' => array('//static/js/common.js', '//static/js/home_friendselector.js', '//static/js/forum.js'),                'home' => array('//static/js/common.js', '//static/js/home_friendselector.js', '//static/js/home_cookie.js', '//static/js/home_common.js', '//static/js/home_face.js', '//static/js/home_manage.js'),                    'userapp' => array('//static/js/common.js', '//static/js/home_friendselector.js', '//static/js/forum.js', '//static/js/home_common.js'),
2.修改模板的header.htm

什么??这个文件在哪里????我被你们打败了。。

修改如下 ,将第一段代码 替换为第二段

                                                                                                                                                                                                                                                                                                                                                                                                         {subtemplate common/css_diy}

替换为

                                                                                                                                                                                                                                                                                   {subtemplate common/css_diy}

打开晋城吧首页,点开源代码 ,看看 开头 的 head 里的 js 是不是少了很多啊

2.修改图片、flash、css、js的缓存时间

为上述东东设置缓存一个长长的缓存时间。比如1年,那么在第一次访问后,用户在这一年中都不用下载背景图,flash,css,js 。当然前提是你没有修改

方法 是修改网站根目录.htaccess文件

加入如下代码

        Header set Cache-Control "max-age=43200″        #cache css, javascript and text files for one week       Header set Cache-Control "max-age=604800″        #cache flash and images for one month      Header set Cache-Control "max-age=2592000″     #disable cache for script files      Header unset Cache-Control     

三、总结

恩,暂时的优化就是这些,通过这些优化,晋城吧 的yslow评分从50 D 上升到80+ B ,有些页面的评分为90+ A.总体还是很有效果的。

如果你需要转发此文,还请保留晋城吧链 接,如果能帮忙做个友链,那就太感谢了。。。

附上一些网站在07年Yslow的评分

Amazon

 D

AOL

CNN

eBay

 C

Google

 A

MSN

MySpace

Wikipedia

Yahoo!

 A

YouTube

作者:晋城吧

文章来源:http://www.jincheng8.com.cn/thread-303-1-1.html

PHP 相关文章推荐
How do I change MySQL timezone?
Mar 26 PHP
php连接数据库代码应用分析
May 29 PHP
php实现文件下载功能的几个代码分享
May 10 PHP
php分页函数完整实例代码
Sep 22 PHP
php中mt_rand()随机数函数用法
Nov 24 PHP
PHP 常用时间函数资料整理
Oct 22 PHP
Thinkphp开发--集成极光推送
Sep 15 PHP
php字符串过滤strip_tags()函数用法实例分析
Jun 24 PHP
php常用字符串长度函数strlen()与mb_strlen()用法实例分析
Jun 25 PHP
PHP中散列密码的安全性分析
Jul 26 PHP
Laravel框架处理用户的请求操作详解
Dec 20 PHP
PHP遍历数组的6种方式总结
Nov 17 PHP
用PHP将数据导入到Foxmail的实现代码
Sep 05 #PHP
提高PHP编程效率的53个要点(经验小结)
Sep 04 #PHP
队列在编程中的实际应用(php)
Sep 04 #PHP
php生成随机密码的三种方法小结
Sep 04 #PHP
PHP安全技术之 实现php基本安全
Sep 04 #PHP
小文件php+SQLite存储方案
Sep 04 #PHP
PHP中文件上传的一个问题
Sep 04 #PHP
You might like
终于听上了直流胆调频
2021/03/02 无线电
解析php中const与define的应用区别
2013/06/18 PHP
XAMPP安装与使用方法详细解析
2013/11/27 PHP
php向js函数传参的几种方法
2014/08/10 PHP
PHP中spl_autoload_register()函数用法实例详解
2016/07/18 PHP
PHP连接SQL Server的方法分析【基于thinkPHP5.1框架】
2019/05/06 PHP
Laravel框架Eloquent ORM简介、模型建立及查询数据操作详解
2019/12/04 PHP
javascript 动态参数判空操作
2008/12/22 Javascript
如何解决Jquery库及其他库之间的$命名冲突
2013/09/15 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
2015/09/16 Javascript
javascript面向对象程序设计高级特性经典教程(值得收藏)
2016/05/19 Javascript
jQuery EasyUI datagrid在翻页以后仍能记录被选中行的实现代码
2016/08/15 Javascript
node.js文件上传处理示例
2016/10/27 Javascript
JS设置时间无效问题的解决办法
2017/02/18 Javascript
Vue中 v-if/v-show/插值表达式导致闪现的原因及解决办法
2018/10/12 Javascript
element-ui的回调函数Events的用法详解
2018/10/16 Javascript
优雅的处理vue项目异常实战记录
2019/06/05 Javascript
BootstrapValidator验证用户名已存在(ajax)
2019/11/08 Javascript
vuex实现数据状态持久化
2019/11/11 Javascript
vue+vant使用图片预览功能ImagePreview的问题解决
2020/04/10 Javascript
JavaScript 中判断变量是否为数字的示例代码
2020/10/22 Javascript
[59:08]Ti4 冒泡赛第二天 NEWBEE vs Titan 2
2014/07/15 DOTA
Python 字符串定义
2009/09/25 Python
Python图像滤波处理操作示例【基于ImageFilter类】
2019/01/03 Python
画pytorch模型图,以及参数计算的方法
2019/08/17 Python
python使用Matplotlib改变坐标轴的默认位置
2019/10/18 Python
python批量处理多DNS多域名的nslookup解析实现
2020/06/28 Python
Python中使用aiohttp模拟服务器出现错误问题及解决方法
2020/10/31 Python
Tommy Hilfiger澳洲官网:美国高端休闲领导品牌
2020/12/16 全球购物
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
小学六年级学生评语
2014/04/22 职场文书
销售团队获奖感言
2014/08/14 职场文书
证婚人致辞精选
2015/07/28 职场文书
大队委员竞选演讲稿
2015/11/20 职场文书
教你部署vue项目到docker
2022/04/05 Vue.js
SpringBoot集成MongoDB实现文件上传的步骤
2022/04/18 MongoDB