首页 后端开发 php教程 晋城吧对DiscuzX进行的前端优化要点_php技巧

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

May 17, 2016 am 09:23 AM
前端优化

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

前端优化 推荐工具

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

一、DX后台 及DIY的优化

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

DX的每一个框架都会产生非常多非常多非常多的 代码。我的首页已经尽可能简单了,结果光 DOM 有1600+,囧死我了。

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

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

/**
* Groups configuration for default Minify implementation
* @package Minify
*/
/**
* You may wish to use the Minify URI Builder app to suggest
* changes. http://yourdomain/min/builder/
**/
return array(

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

'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        F

CNN        F

eBay       C

Google     A

MSN        F

MySpace    D

Wikipedia  C

Yahoo!     A

YouTube    D

作者:晋城吧

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

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
2 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何通过前端优化提升Python网站的访问速度? 如何通过前端优化提升Python网站的访问速度? Aug 05, 2023 am 10:21 AM

如何通过前端优化提升Python网站的访问速度?随着互联网的发展,网站的访问速度成为用户体验的重要指标之一。而对于使用Python开发的网站来说,如何通过前端优化提升访问速度是一个必须要解决的问题。本文将介绍一些前端优化的技巧,帮助提升Python网站的访问速度。压缩和合并静态文件在网页中,静态文件如CSS、JavaScript和图片等会占用大量的带宽和加载

确保可维护的WordPress元框:完成前端部分 确保可维护的WordPress元框:完成前端部分 Aug 27, 2023 pm 11:33 PM

在本系列文章中,我们将回顾一些可用于构建更易于维护的WordPress插件的技巧和策略,并且我们将通过利用选项卡式元框的插件的上下文来实现这一切.在上一篇文章中,我们专门为我们的选项卡实现了功能,并且还实现了第一个textarea,它将用于捕获一些用户输入。对于那些一直关注的人来说,您知道我们只做到了:使选项卡发挥作用引入用户可以与之交互的单个UI元素我们尚未完成清理、验证和保存数据的实际过程,也没有费心介绍其余选项卡的内容。在接下来的两篇文章中,我们将正是这样做的。具体来说,在本文中,我们将继

React移动端适配指南:如何优化前端应用在不同屏幕上的显示效果 React移动端适配指南:如何优化前端应用在不同屏幕上的显示效果 Sep 29, 2023 pm 04:10 PM

React移动端适配指南:如何优化前端应用在不同屏幕上的显示效果近年来,随着移动互联网的迅猛发展,越来越多的用户习惯使用手机来浏览网站和使用各种应用。然而,不同手机屏幕的尺寸和分辨率千差万别,这给前端开发带来了一定的挑战。为了让网站和应用在不同屏幕上都有良好的显示效果,我们需要进行移动端适配,并对前端代码进行相应的优化。使用响应式布局响应式布局是一种根据屏幕

提升网站速度的关键优化模式,每个前端开发者都必须掌握! 提升网站速度的关键优化模式,每个前端开发者都必须掌握! Feb 02, 2024 pm 05:36 PM

前端开发者必备:掌握这些优化模式,让网站飞起来!随着互联网的快速发展,网站已经成为企业宣传和交流的重要渠道之一。一个性能优良、加载迅速的网站不仅可以提升用户体验,还可以吸引更多的访问者。作为一名前端开发者,掌握一些优化模式是必不可少的。本文将介绍一些常用的前端优化技术,帮助开发者更好地优化网站。压缩文件在网站开发中,经常使用的文件类型包括HTML、CSS和J

揭秘前端优化绝招:让网站飞快加载! 揭秘前端优化绝招:让网站飞快加载! Feb 02, 2024 pm 09:11 PM

前端优化大揭秘:让网站速度飞起来!在如今的互联网时代,网站已经成为人们获取信息和进行交流的重要渠道。然而,随着互联网的普及和发展,用户对网站速度的要求也越来越高。一旦网站加载过慢,用户很可能选择离开,甚至转向竞争对手的网站。因此,网站的速度优化变得至关重要。本文将揭秘前端优化的技巧和方法,帮助你让网站速度飞起来!压缩和合并文件在前端开发中,通常会使用大量的C

如何通过前端优化提高Python网站的渲染速度? 如何通过前端优化提高Python网站的渲染速度? Aug 06, 2023 am 08:36 AM

如何通过前端优化提高Python网站的渲染速度?概述:随着互联网的快速发展,用户对网站的加载速度要求越来越高。对于Python网站来说,前端优化可以起到重要的作用,帮助提高网站的渲染速度和用户体验。本文将介绍一些常见的前端优化技巧,以及如何在Python网站中实现。一、压缩和合并静态资源:静态资源如CSS,JavaScript和图片占用了网站加载时间的很大部

现代分布式系统架构的权衡分析 现代分布式系统架构的权衡分析 Mar 06, 2024 pm 12:28 PM

现代软件系统,特别是遵循分布式架构的系统,以其复杂性和可变性而闻名。这些系统由许多元素组成,每个元素都引入潜在的权衡,可能影响成本、性能、可伸缩性和可靠性等因素。对于导航软件现代化和转型领域的IT架构师、业务分析师、数据架构师、软件工程师和数据工程师来说,理解这些权衡至关重要。本文旨在阐明在分布式架构中进行权衡分析的过程和重要性,提供有关与这一复杂但不可或缺的实践相关的方法、技术、工具和竞争方法的见解。软件架构一直是一个需要权衡和决策的领域。在这个以精确和创新为导向的领域中,每一个决策都会带来不

页面性能的关键:优化前端避免页面重绘和回流 页面性能的关键:优化前端避免页面重绘和回流 Jan 26, 2024 am 09:30 AM

前端优化必备:如何有效避免页面重绘和回流,需要具体代码示例随着互联网的快速发展,前端开发在网页性能优化方面变得愈发重要。其中,避免页面重绘和回流是提升网页性能的一项关键因素。本文将介绍一些有效的方法和具体的代码示例,帮助前端开发者有效地减少页面的重绘和回流,提升用户体验。一、页面重绘和回流的原因及影响页面重绘:是指当元素的样式改变时,浏览器需要重新绘制该元素

See all articles