PHP动态压缩js,css

简介:

正式发布产品时,我们希望将项目里的js,css合并压缩,以减少http请求、防止轻易查看源代码。

使用

只需要在头部引入一下代码即可:

    <meta charset="utf-8"/>
    <title>demo</title>

    <?php
    //定义需要压缩的文件
    $css = array(
        CSS_PATH . 'base.css',
        CSS_PATH . 'style.css',
        CSS_PATH . 'my.css'
    );

    $js = array(
        PUB_PATH . '/lib/zepto.min.js',
        PUB_PATH . '/js/1.js',
        JS_PATH . '2.js',
    );

    $css_path = base_url(parse_css($css));
    $js_path = base_url(parse_script($js));

    ?>

    <link rel="stylesheet" type="text/css" href="<?php echo $css_path ?>">
    <script src="<?php echo $js_path ?>"></script>
    
    <!--下面可以继续放不能压缩或者不想压缩的文件-->
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

这段代码会在指定的目录(例如common/)里生成压缩过后的js和css.每次更新了js,css内容,请先删除生成的压缩文件。

示例:

4e387d5edce14cc2bd6396f6ebb7921b.css
 7c10211f113f3175489196d336d67734.js

注意:
编写的css和js文件一定要符合规范。例如一定要加分号。js的function可以不加分号。

引用的资源


/**
*   合并压缩css
*/
function parse_css($urls)
{
    $url = md5(implode(',', $urls));
    $path = FCPATH. 'static/parse/';
    $css_url = $path . $url . '.css';
    if (!file_exists($css_url)) {
        if (!file_exists($path))
            mkdir($path, 0777);
        $css_content = '';

        foreach ($urls as $url) {
            $css_content .= @file_get_contents($url);
        }

        $css_content = str_replace("\r\n", '', $css_content); //清除换行符
        $css_content = str_replace("\n", '', $css_content); //清除换行符
        $css_content = str_replace("\t", '', $css_content); //清除制表符

        $css_content = str_replace("../images/", "./../common/images/", $css_content);
        @file_put_contents($css_url, $css_content);
    }

    $css_url = str_replace(FCPATH, '', $css_url);
    return $css_url;
}

/**
*   合并压缩js
*/
function parse_script($urls)
{
    $url = md5(implode(',', $urls));
    $path = FCPATH. '/static/parse/';
    $js_url = $path . $url . '.js';
    if (!file_exists($js_url)) {
        if (!file_exists($path))
            mkdir($path, 0777);

        load_qy_lib('JavaScriptPacker');

        $js_content = '';
        foreach ($urls as $url) {
            $append_content = @file_get_contents($url) . "\r\n";
            $packer = new JavaScriptPacker($append_content);
            $append_content = $packer->_basicCompression($append_content);
            $js_content .= $append_content;
        }
        @file_put_contents($js_url, $js_content);
    }

    $js_url = str_replace(FCPATH, '', $js_url);
    return $js_url;
}

项目里引用到第三方类库JavaScriptPacker可以在github下载:
/**
 * 9 April 2008. version 1.1
 *
 * This is the php version of the Dean Edwards JavaScript's Packer,
 * Based on :
 *
 * ParseMaster, version 1.0.2 (2005-08-19) Copyright 2005, Dean Edwards
 * a multi-pattern parser.
 * KNOWN BUG: erroneous behavior when using escapeChar with a replacement
 * value that is a function
 *
 * packer, version 2.0.2 (2005-08-19) Copyright 2004-2005, Dean Edwards
 *
 * License: http://creativecommons.org/licenses/LGPL/2.1/
 *
 * Ported to PHP by Nicolas Martin.
 *
 * ----------------------------------------------------------------------
 * changelog:
 * 1.1 : correct a bug, '\0' packed then unpacked becomes '\'.
 * ----------------------------------------------------------------------
 *
 * Changes:
 * 2014-08-28: grkalik: change class for composer support. no functionality change.
 *
 */


相关文章
|
9天前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
103 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
1月前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
43 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
2月前
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
146 21
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
2月前
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
62 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
2月前
html+js+css实现的建筑方块立体数字时钟源码
html+js+css实现的建筑方块立体数字时钟源码
101 33
|
3月前
一个好看的小时钟html+js+css源码
一个好看的小时钟html+js+css源码
123 24
|
3月前
|
JavaScript 前端开发
页面滚动触发css3动画js插件
delighters.js是一款页面滚动触发css3动画js插件。该js插件可以在页面向下滚动时,为进入浏览器视口的元素制作各种炫酷的CSS3动画效果。
62 13
|
27天前
|
关系型数据库 MySQL 网络安全
如何排查和解决PHP连接数据库MYSQL失败写锁的问题
通过本文的介绍,您可以系统地了解如何排查和解决PHP连接MySQL数据库失败及写锁问题。通过检查配置、确保服务启动、调整防火墙设置和用户权限,以及识别和解决长时间运行的事务和死锁问题,可以有效地保障应用的稳定运行。
130 25
|
4月前
|
前端开发 关系型数据库 MySQL
PHP与MySQL动态网站开发实战指南####
【10月更文挑战第21天】 本文将深入浅出地探讨如何使用PHP与MySQL构建一个动态网站,从环境搭建到项目部署,全程实战演示。无论你是编程新手还是希望巩固Web开发技能的老手,都能在这篇文章中找到实用的技巧和启发。我们将一起探索如何通过PHP处理用户请求,利用MySQL存储数据,并最终呈现动态内容给用户,打造属于自己的在线平台。 ####
150 0
|
3月前
|
存储 关系型数据库 MySQL
PHP与MySQL动态网站开发:从基础到实践####
本文将深入探讨PHP与MySQL的结合使用,展示如何构建一个动态网站。通过一系列实例和代码片段,我们将逐步了解数据库连接、数据操作、用户输入处理及安全防护等关键技术点。无论您是初学者还是有经验的开发者,都能从中获益匪浅。 ####

热门文章

最新文章