2อันบนต้องแก้ยังไงแนะนำทีจ้า Page Speed

[narupot]

 

ปัญหาโลกแตกตามแก้ย๊ากยาก (สำหรับเรานะ)

[CONY]

1.ใส่ค่าความกว้าง ความสูงในทุกแท็ก img
2.ทำแคชให้ static file เช่นไฟล์ image, css, js

[narupot]

1.ใส่ค่าความกว้าง ความสูงในทุกแท็ก img
2.ทำแคชให้ static file เช่นไฟล์ image, css, js

ทำยังไงฮะ พอมีวิธีสอนมั้ย ><

[CONY]

ลองเช็คแท็ก <img> อ่ะครับ ว่าได้ใส่ค่า attribute แบบนี้ป่าว <img src="..." width="..." height="..." />
ส่วนการแคชไฟล์ static ลองอ่านอันนี้ดูครับ
https://varvy.com/pagespeed/cache-control.html

[eyejan]

อยากจะบอกว่า ท่านไม่ควรใช้ GT Metrix นะครับ

ตัวเช็คความเร็วตัวเดียวที่ Google แนะนำอย่างเป็นทางการคือ

https://www.webpagetest.org/

ให้เน้นที่ time to first byte นะครับ อย่าให้เกิน 3วินาที

วิธีการปรับปรุงคือ ใช้ DNS แบบที่มันเร็วๆ แล้วก็ server ที่มันแรงนะครับ

[momo2]

มาเก็บความรู้ครับ

[infamous]

อยากจะบอกว่า ท่านไม่ต้องไปเครียดกับสกอร์พวกนี้ครับ มันก็แค่ตัวเลขเท่านั้น

แต่ถ้าจะเล่นจริงๆ ก็ต้องศึกษาพวก defer, async resource loading, page's resource reducing ครับ เช่น

เปลี่ยน
<img src="xxx" width="yyy" height="zzz">
เป็น
<span data-src="xxx" data-width="yyy" data-height="zzz" data-title="blah"></span>

แบบด้านบน browser มันจะมองเห็นเป็น span ครับ มันจะไม่คำนวณ dimensions หรือโหลดภาพก่อน และมันจะทำให้ขนาดของหน้าเพจเล็กลงกว่าที่เรายัด img ลงไปตรงๆด้วย

จากนั้นโหลดหน้าเพจเสร็จ ค่อยเอา js มา render ด้วย $.defered() อีกที บางท่านอาจจะรู้จักครับว่ามันเป็นเทคนิค Lazy loading

ส่วนปัญหาเรื่อง cache ก็ให้ดูเรื่อง cache control header ครับ ผ่าน .htaccess มีตัวอย่างให้ดูเยอะครับใน gg

ปล แค่เทคนิคเล็กๆน้อยๆนะครับ

[narupot]

ขอบคุณทุกๆคนมากครับ หวังว่าเป็นความรู้กับคนอื่นๆด้วยครับ ^^

[darkknightza]

1.ใส่ค่าความกว้าง ความสูงในทุกแท็ก img
2.ทำแคชให้ static file เช่นไฟล์ image, css, js

เจ๋งมากคับ

[kanesz12]

อยากจะบอกว่า ท่านไม่ควรใช้ GT Metrix นะครับ

ตัวเช็คความเร็วตัวเดียวที่ Google แนะนำอย่างเป็นทางการคือ

https://www.webpagetest.org/

ให้เน้นที่ time to first byte นะครับ อย่าให้เกิน 3วินาที

วิธีการปรับปรุงคือ ใช้ DNS แบบที่มันเร็วๆ แล้วก็ server ที่มันแรงนะครับ

ความรู้ใหม่เบยครับ