网站开发者对CSS.JS文件发布机制的思考 admin 2009-8-7 18:54:00 解决方案如下： 描述 备注 资源级别 页面的资源级别： 全局级（Common） 模块级（Module） 页面级（Page） 优化方案 优化主要从以下几个方面： 减少单个文件的字节大小 减少文件的个数（即减少http请求数） 其他的优化是从开发技巧上进行的，取决于专业水平 文件输出方案 合并 压缩 基于资源级别及优化方案，制定以下4种方案： 1、直接引用单个文件依次引入（<link/>、<script/>） 2、基于1，进行单个文件压缩 3、按照资源级别合并成新的单个文件 4、基于3，进行合并后的文件压缩 思考点 方案3： 如何确定合并的文件个数？ 缓存问题 采用时间戳后缀 f2econfig_json 配置文件： var f2eJson={ "Version":"v3",//版本 "Update":"20091015",//根据时间戳更新缓存 "Compress":"1",//文件输出方案（1，2，3，4） "Common":[//全站公共样式 "common/global.css" ], "Module":{ //模块及样式 "模块1":["product,.css"] }, "Page":{//每个页面所拥有的样式 "index.php":["","sys/index.css"], //第一个元素存储模块引用名称，无则留空 "search.php":["模块1","product/search.css"] //引用多个模块，用 “，”隔开，比如： 模块1，模块2 } } php有专门的json转换库 js的配置结构同css的配置json f2engine.php 1、读取json配置文件，转化成php数组 2、根据每个页面的资源参数，查找该页面拥有的样式资源 3、根据文件输出方案，进行处理 4、在页面上输出 配置文件没有更新的情况下，只解析一次json为数组 只解析一次资源，并将结果保存，供下次直接使用 例子 比如search.php这个页面的样式引用 根据页面找到页面级资源： Page["search.php"] 根据该数组的第一个值查找所引用的模块样式 根据配置文件中的“Compress”值确定文件输出方案，并进行处理 在页面上进行输出 //全站样式 common <link type="text/css" href="common/global.pack.css?20091015" rel="stylesheet" /> //模块样式 module <link type="text/css" href="product.pack.css?20091015" rel="stylesheet" /> //页面样式 page <link type="text/css" href="product/serach.pack.css?20091015" rel="stylesheet" /> 注:压缩后文件名称变为 search.pack.css 代码在开发中。欢迎大家一起探讨指教下。 分享联系我们 扫二维码与项目经理沟通 我们在微信上24小时期待你的声音 感谢您的关注分享“网站开发者对CSS.JS文件发布机制的思考” 烟寒网络真诚为您服务 ，点击客服直接咨询下单. 立即咨询 我们服务 网站建设 高端网站建设服务商、相信品牌力量、相信知名企业；制作后收费13014982176！ 微信小程序/微信公众号 微信小程序 背靠10亿流量，不论用户需求是什么，都能被开发使用 一点创意，就能在“社交圈”中脱颖而出。 网站优化/SEO 让您的网站更靠近排名位置，让客户更容易找到您，seo优化是一个漫长过程，整个网站营销花最少的钱起最大的作用。