移動Web前端性能與圖片優(yōu)化的研究
發(fā)布時間:2024-01-12 08:13
近年來,隨著智能移動設備的普及,移動互聯(lián)網(wǎng)成為了互聯(lián)網(wǎng)發(fā)展的新動力,同時也為移動學習的跨越式發(fā)展帶來了新契機。移動設備間的差異和無線網(wǎng)絡資源的稀缺決定在移動學習開發(fā)時必須關注應用的性能問題。在紛繁復雜的移動學習Web站點中,用戶更傾向于使用可以迅速響應、完美交互的優(yōu)秀產(chǎn)品。這就形成了對web站點進行優(yōu)化的迫切需求。Web站點優(yōu)化可分為后端優(yōu)化和前端優(yōu)化兩部分。研究表明,用戶響應時間中只有10%~20%是花在了下載HTML文檔上,其余的時間則花在了下載頁面中的所有組件上。也就是說,如果關注前端性能并將其響應時間減少一半,整體響應時間可減少40%~45%;加之國內在后端的優(yōu)化技術已經(jīng)比較成熟,所以本文專注于Web前端的性能優(yōu)化。 本文首先介紹了移動Web前端優(yōu)化的國內外研究現(xiàn)狀,提出進行移動web前端性能優(yōu)化的必要性。然后對Web的工作方式如HTTP協(xié)議、瀏覽器工作機制等和移動開發(fā)的特殊性進行介紹,web工作方式構成了在移動學習開發(fā)過程中進行性能優(yōu)化的現(xiàn)實依據(jù)和理論基礎。本文中間部分從html、CSS、JavaScript、圖片和緩存五個方面,圍繞內存和CPU兩個核心主題,結合移動學習開發(fā)...
【文章頁數(shù)】:56 頁
【學位級別】:碩士
【文章目錄】:
摘要
ABSTRACT
第一章 緒論
1.1 課題背景
1.2 國內外現(xiàn)狀分析
1.2.1 國內現(xiàn)狀
1.2.2 國外現(xiàn)狀
1.3 本文所做工作
1.4 論文章節(jié)安排
第二章 WEB前端性能優(yōu)化概述
2.1 網(wǎng)站優(yōu)化
2.1.1 搜索引擎市場營銷
2.1.2 網(wǎng)站性能優(yōu)化
2.2 前端性能優(yōu)化
2.2.1 站點頁面的組成
2.2.2 客戶端工作機制
2.2.3 HTTP協(xié)議
2.3 移動WEB開發(fā)的特殊性
2.3.1 屏幕尺寸多樣化
2.3.2 設備性能
2.4 本章小結
第三章 移動WEB前端性能優(yōu)化的方案
3.1 HTML的優(yōu)化處理
3.1.1 減少HTML的重新布局與重繪
3.1.2 HTML的合法性測試
3.1.3 HTML的壓縮處理
3.2 CSS的優(yōu)化
3.2.1 CSS文件放在文檔頂部
3.2.2 編寫高校的CSS選擇器
3.2.3 利用CSS3的media query
3.2.4 不要過分信任和濫用CSS3
3.3 JAVASCRIPT的內存控制
3.3.1 DOM事件處理
3.3.2 數(shù)據(jù)訪問
3.3.3 算法優(yōu)化和流程控制
3.3.4 JavaScript的加載與執(zhí)行
3.4 圖片的優(yōu)化
3.4.1 簡單的優(yōu)化處理
3.4.2 具體的無損圖像優(yōu)化
3.4.3 CSS Sprites及其優(yōu)化
3.4.4 移動設備對圖片的特殊要求
3.5 利用緩存技術
3.6 本章小結
第四章 CSS SPRITES制作算法的提出與優(yōu)化
4.1 常規(guī)算法
4.1.1 算法的平凡解
4.1.2 常規(guī)算法
4.1.3 不重疊地放置矩形
4.2 算法改進
4.2.1 減小閉合矩形的寬度時有效增加高度
4.2.2 無法放置所有的矩形時有效增加閉合矩形的高度
4.2.3 權衡外接矩形的大小與求解時間
4.3 算法測試
4.3.1 評測標準
4.3.2 測試結果
4.4 本章小結
第五章 總結與展望
5.1 總結
5.2 展望
參考文獻
攻讀碩士學位期間參與的項目
致謝
本文編號:3877859
【文章頁數(shù)】:56 頁
【學位級別】:碩士
【文章目錄】:
摘要
ABSTRACT
第一章 緒論
1.1 課題背景
1.2 國內外現(xiàn)狀分析
1.2.1 國內現(xiàn)狀
1.2.2 國外現(xiàn)狀
1.3 本文所做工作
1.4 論文章節(jié)安排
第二章 WEB前端性能優(yōu)化概述
2.1 網(wǎng)站優(yōu)化
2.1.1 搜索引擎市場營銷
2.1.2 網(wǎng)站性能優(yōu)化
2.2 前端性能優(yōu)化
2.2.1 站點頁面的組成
2.2.2 客戶端工作機制
2.2.3 HTTP協(xié)議
2.3 移動WEB開發(fā)的特殊性
2.3.1 屏幕尺寸多樣化
2.3.2 設備性能
2.4 本章小結
第三章 移動WEB前端性能優(yōu)化的方案
3.1 HTML的優(yōu)化處理
3.1.1 減少HTML的重新布局與重繪
3.1.2 HTML的合法性測試
3.1.3 HTML的壓縮處理
3.2 CSS的優(yōu)化
3.2.1 CSS文件放在文檔頂部
3.2.2 編寫高校的CSS選擇器
3.2.3 利用CSS3的media query
3.2.4 不要過分信任和濫用CSS3
3.3 JAVASCRIPT的內存控制
3.3.1 DOM事件處理
3.3.2 數(shù)據(jù)訪問
3.3.3 算法優(yōu)化和流程控制
3.3.4 JavaScript的加載與執(zhí)行
3.4 圖片的優(yōu)化
3.4.1 簡單的優(yōu)化處理
3.4.2 具體的無損圖像優(yōu)化
3.4.3 CSS Sprites及其優(yōu)化
3.4.4 移動設備對圖片的特殊要求
3.5 利用緩存技術
3.6 本章小結
第四章 CSS SPRITES制作算法的提出與優(yōu)化
4.1 常規(guī)算法
4.1.1 算法的平凡解
4.1.2 常規(guī)算法
4.1.3 不重疊地放置矩形
4.2 算法改進
4.2.1 減小閉合矩形的寬度時有效增加高度
4.2.2 無法放置所有的矩形時有效增加閉合矩形的高度
4.2.3 權衡外接矩形的大小與求解時間
4.3 算法測試
4.3.1 評測標準
4.3.2 測試結果
4.4 本章小結
第五章 總結與展望
5.1 總結
5.2 展望
參考文獻
攻讀碩士學位期間參與的項目
致謝
本文編號:3877859
本文鏈接:http://sikaile.net/guanlilunwen/ydhl/3877859.html
最近更新
教材專著