ก่อนอื่น ทดสอบ PageSpeed Insights ของกูเกิ้ลตามลิ้งนี้เลยครับ
https://developers.google.com/speed/pagespeed/insights 
ของผมปรับจาก 69 ขึ้นมา 80 แล้ว แต่ยังไม่เสร็จดี เห็นว่ามันใช้ได้ เลยเอามาแชร์กันก่อน ขาดตกบกพร่องประการใด โปรดชี้แนะด้วยนะครับ (เว็บเขียนเองทั้งหมดครับ ไม่ได้ใช้ CMS)
-
ปรับขนาดภาพให้เหมาะสม ผมก็ลองไล่ดูรูปตามที่กูเกิ้ลแนะนำ แล้วนำมาเปิดใน photoshop แล้วเซฟใหม่ให้ภาพมันมีขนาดเล็กลงให้มากที่สุดโดยที่ยังดูรู้เรื่อง สวยงามอยู่ ข้อนี้จะช่วยได้เยอะเลยครับ พวกโลโก้ ไอคอนเล็กๆ ปรับให้หมดครับ ถ้าให้ดีควรทำ
-
ลดขนาด JavaScript อันนี้ผมใช้
http://javascriptcompressor.com เว็บนี้ในการปรับลดขนาด Javascript โดยก็อปโค้ดไปวางแล้ว ก็อปไปเซฟใหม่เลยครับ มันจะกำจัดช่องว่างให้หมดเลยครับ ทำให้ไฟล์เล็กลง อีกอย่างถ้าในหน้ามีการเรียกไฟล์ JS หลายตัว ถ้ารวมกันได้ก็ให้รวมกันไว้ในไฟล์เดียวกันเลย ผมพลาดข้อนี้ไปเหมือนกัน ตอนแรกแยกไฟล์ตามการใช้งาน สุดท้ายก็ต้องเอามารวมกัน พอบีบอัดแล้วก็ไม่ใหญ่มาก แต่ลด HTTP Request ได้เยอะ ไปเจอบทความนี้มา อธิบายได้ดีครับ
http://www.siamhtml.com/reduce...-http-requests-using-data-uri/ -
ลดขนาด CSS อันนี้ผมไล่ลบ ช่องว่าง กับการขึ้นบรรทัดใหม่เองเลย เพราะหา tool ไม่เจอ ถ้าใครมีอะไรดีๆ ก็บอกด้วยนะครับ ไฟล์ไหนรวมกันได้ก็รวมกันเลย เพื่อลด HTTP Request
-
ลดขนาด HTML อันนี้ก็ด้นสดเหมือนกันครับ ปรับให้มีช่องว่างน้อยที่สุด ลบบรรทัดว่างๆให้หมด ก็ช่วยให้ไฟล์เล็กลงนิดนึง
-
กำหนดการแคชในเบราว์เซอร์ เปิดไฟล์ .htaccess แล้วใส่โค้ดตามนี้เลยครับ จะช่วยให้แคชไฟล์ js,css ไม่ต้องโหลดใหม่ทุกครั้ง ตรงนี้ใครเซียน ช่วยเสริมด้วยนะครับ
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
AddOutputFilter DEFLATE css js
ExpiresActive On
ExpiresByType application/x-javascript A2592000
-
เปิดใช้งานการบีบอัด เปิดไฟล์ .htaccess แล้วใส่โค้ดตามนี้เลยครับ ใช้ gzip ช่วยบีบอัดไฟล์จาก server ก่อนที่จะส่งมายัง Client ครับ
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>
การแก้ปัญหาดังกล่าวข้างต้น มีหลายวิธีนะครับ ใครมีวิธีดีๆ ก็มาแชร์กันได้ครับ ของผมปรับแล้วมันก็ยังไม่สมบูรณ์ดี แต่คะแนนขึ้นมาก็โอเคแล้วครับ ปรับเวอร์ชั่นเว็บไปแล้ว เหลือแต่เวอร์ชั่นโมบาย ต้องไปศึกษาต่อเพราะดูคร่าวๆมีเรื่องขนาดการแสดงผลของตัวอักษรขึ้นมาด้วย ผิดพลาดยังไง ชี้แนะด้วยครับ
มีแถมครับ ไปเจอมาว่า "ตกลง Javascript ควรใส่ไว้ที่ไหน"
www.siamhtml.com/javascript-head-body-ควรใส่ไว้ที่ไหน อัพเดต
http://csscompressor.com/ ใช้ในการลดขนาด CSS ครับ
ความรู้ทั่วไป
