晋城吧对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 相关文章推荐
如何实现给定日期的若干天以后的日期
Oct 09 PHP
表单复选框向PHP传输数据的代码
Nov 13 PHP
PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数
Apr 09 PHP
关于php操作mysql执行数据库查询的一些常用操作汇总
Jun 24 PHP
解析PHP 5.5 新特性
Jul 02 PHP
php网站判断用户是否是手机访问的方法
Nov 01 PHP
php安装swoole扩展的方法
Mar 19 PHP
PHP正则表达式过滤html标签属性(DEMO)
May 04 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
Feb 23 PHP
safari下载文件自动加了html后缀问题
Nov 09 PHP
Laravel6.0.4中将添加计划任务事件的方法步骤
Oct 15 PHP
php操作redis命令及代码实例大全
Nov 19 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
php根据一个给定范围和步进生成数组的方法
2015/06/19 PHP
thinkPHP5.0框架独立配置与动态配置方法
2017/03/17 PHP
Laravel框架模板继承操作示例
2018/06/11 PHP
PHPExcel实现表格导出功能示例【带有多个工作sheet】
2018/06/13 PHP
PHP判断访客是否手机端(移动端浏览器)访问的方法总结【4种方法】
2019/03/27 PHP
javascript应用:Iframe自适应其加载的内容高度
2007/04/10 Javascript
ajaxControlToolkit AutoCompleteExtender的用法
2008/10/30 Javascript
JQUERY操作JSON实例代码
2010/02/09 Javascript
Javascript 面向对象(一)(共有方法,私有方法,特权方法)
2012/05/23 Javascript
jQuery zclip插件实现跨浏览器复制功能
2015/11/02 Javascript
Angularjs的ng-repeat中去除重复数据的方法
2016/08/05 Javascript
原生JS:Date对象全面解析
2016/09/06 Javascript
详解如何使用vue-cli脚手架搭建Vue.js项目
2017/05/19 Javascript
通过构造函数实例化对象的方法
2017/06/28 Javascript
一步一步实现Vue的响应式(对象观测)
2019/09/02 Javascript
Vue-cli3项目引入Typescript的实现方法
2019/10/18 Javascript
Javascript组合继承方法代码实例解析
2020/04/02 Javascript
JavaScript常用进制转换及位运算实例解析
2020/10/14 Javascript
flask中使用SQLAlchemy进行辅助开发的代码
2013/02/10 Python
在Python的循环体中使用else语句的方法
2015/03/30 Python
Python中设置变量作为默认值时容易遇到的错误
2015/04/03 Python
Python读写unicode文件的方法
2015/07/10 Python
Python操作Access数据库基本步骤分析
2016/09/19 Python
Python图像滤波处理操作示例【基于ImageFilter类】
2019/01/03 Python
Python判断有效的数独算法示例
2019/02/23 Python
Python爬取豆瓣视频信息代码实例
2019/11/16 Python
pycharm不能运行.py文件的解决方法
2020/02/12 Python
python 引用传递和值传递详解(实参,形参)
2020/06/05 Python
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
2014/10/11 HTML / CSS
应届生新闻编辑求职信
2013/11/19 职场文书
学生拾金不昧表扬信
2014/01/21 职场文书
表彰会主持词
2014/03/26 职场文书
导游词之无锡华莱坞
2019/12/02 职场文书
深入浅出讲解Java8函数式编程
2022/01/18 Java/Android
基于Python实现流星雨效果的绘制
2022/03/18 Python
MySQL学习之基础命令实操总结
2022/03/19 MySQL