網站開發者對CSS.JS文件發布機制的思考 By 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優化是一個漫長過程，整個網站營銷花最少的錢起最大的作用。