һ
 ¼ע

QQ¼

ֻһٿʼ

̳ WEBҳǰ뿪 WEBҳܱ

[ҳ] ƶH5ǰŻָ

[]
23042 happy175 2015-1-28 10:06:19
| ʾȫ¥
1F

ϵ½עᣬύѣø๦ܣϴزIJޣ

Ҫ ¼ ſػ鿴ûʺţ¼ע

x
20150108170945527.png

ƶH5ǰŻָ


1. PCŻֶMobileͬ

2. MobileȾָ
3. ڵڶ㣬3ɻʹLoading

4. ͨ3Gƽ338KB/s(2.71Mb/s)ԴӦ1014KB
5. Mobileֻԭ򣬳ȾٶҲŻص

6. ڵ㣬ҪȾ

7. ڵڶ㣬ӰغȾĴӦڴ߼к
8. ɺûʹʱҲע

Żָ

[Ż]

عΪʱḶܻ́ռܺʱ80%ʱ䣬Żص

HTTP
ΪֻͬʱӦΪ4Android֧4iOS 5֧6Ҫҳ״μͬʱܳ4
a) ϲCSSJavaScript

b) ϲСͼƬʹѩͼ

ʹûԼʡʱ䣬о̬ԴҪڷû棬ҾʹóCacheCacheԴĸ¿ʹʱ
a) һпɻԴ

b) ʹóCacheʹʱCache

c) ʹʽCSSJavaScript

ѹHTMLCSSJavaScript
ԴСԼӿҳʾٶȣҪHTMLCSSJavaScriptȽдѹڷGZip
a) ѹ磬Ŀո񡢻з

b) GZip

дHTMLͷJavaScript첽дHTMLǩеStyleҳȾCSSҳͷʹLinkʽ룬HTMLǩдStyleJavaScriptҳβ

ʹ첽ʽ

ʹ
ĿʾԴûҳٶȵĸ֪ӦĿʾŻ

ӰԴ͵ǰĻԴõԴŵûҪʱżأԴҪԴʾٶȺͽ

PSػᵼ´ػ棬ӰȾ
a) LazyLoad

b)

c) ͨMedia Query

Ԥ
Դҳ棨ϷʹLoadingķԴɺʾҳ档Loadingʱûʧ
ûΪڵǰҳһҳԴٶ

a) ɸ֪Loading(ռϷLoading)

b) ɸ֪Loadingǰһҳ

ѹͼƬ
ͼƬռԴ˾ʹʹʱѡʵĸʽʵǰ£ԴСжϣʵĴСȻʹͼѹͬʱڴSrcsetʾ
PSѹͼƬСӰͼƬʾЧ

b) ʹʽͼƬ(1. ʹCSS3 2. ʹSVG 3. ʹIconFont)

c) ʹSrcset

d) ѡʵͼƬ(1. webPJPG 2. PNG8GIF)

e) ѡʵĴС1. ״μز1014KB 2. 640ֻĻһȣ

Cookie
CookieӰٶȣԾ̬ԴʹCookie

ض
ضӰٶȣڷȷñض

첽صԴ
ԴɿػӰҳļغʾҪ첽صԴ

[űִŻ]

űҳءȾʹʱ赱ע

CSSдͷJavaScriptдβ첽
ͼƬiFrameȵĿSrc
Src¼صǰҳ棬ӰٶȺЧ

ͼƬС
ͼƬСָҳ桢CSSJavaScriptжͼƬСͼƬСͼƬĶػ棬Ӱ

ͼƬʹDataURL
DataURLͼƬûʹͼƬѹ㷨ļ󣬲ҪȾʱ

[CSSŻ]

дHTMLǩдStyle

CSSʽ
CSSʽִCSSȾCSSʽ

ƳյCSS
յCSSCSSļĴСӰCSSִУƳյCSS

ȷʹDisplay
DisplayԻӰҳȾʹ

a) display:inlineӦʹwidthheightmarginpaddingԼfloat

b) display:inline-blockӦʹfloat

c) display:blockӦʹvertical-align

d) display:table-*Ӧʹmarginfloat

Float
FloatȾʱȽϴ󣬾ʹ

Web
WebҪأػ浱ǰҳ棬ʹ

Font-size
Font-sizeCSSЧ

ֵΪ0ʱҪκελ
ΪļԺܣֵΪ0ʱҪλ

׼ǰ׺
a) ǰ׺Ӧ

b) CSSֻ -webkit- ǰ׺ּ

c) ǰ׺Ϊ -webkit- -moz- -ms- ǰ׺ ֣-o-Operablinkںˣ̭

ѡʽ
߼ѡִкʱҲ׶ʹ

[JavaScriptִŻ]

ػͻ
a) ⲻҪDom

b) ıClassStyleʹclassListclassName

c) ʹdocument.write

d) drawImage

Domѡ
ÿDomѡҪ㣬

б.length
ÿ.lengthҪ㣬һֵ

ʹ¼¼

ʹIDѡ
IDѡ

TOUCH¼Ż
ʹtouchstarttouchendclickӰٶȿ졣ӦעTouchӦ죬

[ȾŻ]

HTMLʹViewport
ViewportԼҳȾʹ´

Domڵ
Domڵ̫ӰҳȾӦDomڵ

Ż
a) ʹCSS3

b) ʹrequestAnimationFramesetTimeout

c) ʵʹCanvas 5Ԫʹcss5ʹCanvasiOS8ʹwebGL

Ƶ¼Ż
TouchmoveScroll ¼ɵ¶Ⱦ

a) ʹrequestAnimationFrame֡仯ʹȷʱȾ

b) Ӧ仯ʱػ

GPU
CSSԣCSS3 transitionsCSS3 3D transformsOpacityCanvasWebGLVideoGPUȾʹ

PSʹûֻĵ





Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ
2015-5-21 08:44:37
| ʾȫ¥
2F


   HOHO~~~~~~
Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ ֧
sczsi 2015-7-1 13:01:10
| ʾȫ¥
3F
˵IJ³ġ˴һˣռȻȱԪϵĻ! ˿һ켸ٲ!ɱ΢֣
ٵ˾ʵƷý屨
"+ѷ++ѱ䷢չ"ģʽ
תǮûĶҲ׬Ǯ ˿ɡ
8ɣԼƹ㣬޿
֧֣뵽ϵͳ
5ǰˡ10ǰԱ㻹׼ڵ˴
㻹ڳ˯㻹ûлʶ㻹ʱĵô㽫ٵĽ
ճζʲô˵Ͻ~~
ӿֱע˴԰ɡҵ:http://suo.im/mei8s
ҵ룺15658828613    ˴www.rrchuan.com
˴׬ҵȺ  ӭ˴ҵȺ  Ⱥ룺158040402ע˽Ⱥ
Դ΢http://weibo.com/techued Դ΢Źںţweb-tech
ʹõ ٱ ظ ֧
б

ֹ

̳¡ͼƬѷϴվԭתԻ,µİȨԭ
վַİȨ֪ͨǵĹԱ,Ա(Email:admin@websjy.com)ʱȡȨɾ
ܾκκʽڱ̳л񹲺͹ִ!

QQ| 42011102000510|Archiver|ֻ|Դ-̳ ( ICP19023897-2 )

GMT+8, 2021-10-24 11:24

ٻظ ض б