ตั้งให้เราเป็นเว็บแรกที่คุณเลือก เก็บเราไว้เป็นเว็บโปรด Facebook Youtube Twitter Google+
สมัครสมาชิก ได้มากกว่าที่คุณคิด เข้าสู่ระบบ
  • หน้าแรก
  • ข่าวไอที
  • แอพดีบอกต่อ
  • โปรแกรมเด็ด
  • Social Network
  • โปรแกรมแต่งรูป
  • Photoshop
  • ภาพอาร์ต
  • คำคมภาษาอังกฤษ
  • เว็บบอร์ด
เว็บไอที ข่าวมือถือ App ฮิต › โปรแกรมแต่งรูป › โปรแกรมเด็ด เทคโนโลยี ไอที »วิเคราะห์ สาเหตุที่ทำเว็บข ...
โพสต์เรื่องใหม่
กลับไป

วิเคราะห์ สาเหตุที่ทำเว็บของคุณช้าด้วย PageSpeed Insights (by Google)

โพสต์โดย: admin | เมื่อ: 2016-5-29 09:28| เปิดอ่าน: 2099| ความคิดเห็น: 0

admin โพสต์ 2016-5-29 09:28:17 | ดูโพสต์ทั้งหมด |โหมดอ่าน
เสื้อหมา เสื้อแมว รถเข็นหมา รถเข็นแมว

Screen-Shot-2557-12-22-at-11.43.51-PM.png

เราจะใช้ PageSpeed Insights ซึ่งสามารถหาโหลดได้จากทาง extension ใน chrom วิเคราะห์ สาเหตุที่ทำเว็บของคุณช้าด้วย PageSpeed Insights (by Google)

Screen-Shot-2556-12-21-at-3.39.25-AM-300x185.png
ตามรูปเลยนะครับเพื่อใครหาไม่เจอ  จากนั้นเมื่อเราติดตั้งเสร็จจะพบสัญลักษณ์ที่มุมขวาบน ก็เป็นอันว่าติดตั้งเสร็จเรียบร้อยครับ สามารถกดเพื่อดูรายละเอียดได้นะครับ

Screen-Shot-2556-12-21-at-3.47.16-AM-300x185.png

จากนั้นให้เราเข้าเว็บไซต์ของเรากันเลยเมื่อเข้ามาแล้วให้คลิกขวา เลือกที่ inspect element ตามรูปเลยครับ

Screen-Shot-2556-12-21-at-3.49.48-AM.png
จากนั้นจะมีหน้าพวกโค้ด html ขึ้นมาไม่ต้องสนใจครับกดที่ Pagespeed ด้านบนแล้วเลือก start analyzing เพื่อทำการวิเคราะห์หน้าเว็บไซต์ของเรา และ โหลดสักครู่ครับ

Screen-Shot-2556-12-21-at-3.50.00-AM-300x174.png
Screen-Shot-2556-12-21-at-3.52.43-AM-300x193.png
จากนั้นเมื่อมันโหลดเสร็จเรียบร้อยก็จะได้หน้าตาแบบนี้ครับด้านซ้ายมือก็คือรายละเอียดหัวข้อต่างๆขึ้นมาบอกว่าเราควรแก้ไขอะไรบ้างและจะแบ่งเป็นข้อย่อยๆไป และมีอะไรที่เราแก้ไขเสร็จไปแล้ว ยกตัวอย่างเช่น

Screen-Shot-2556-12-21-at-3.37.54-AM-300x193.png
อาจจะแนะนำให้บีบอัดไฟล์แล้วก็จะขึ้นรายละเอียดไฟล์ขึ้นมาว่าไฟล์ไหนบ้าง
Screen-Shot-2556-12-21-at-3.38.03-AM-300x193.png
หรือจจะเป็นการทำ minify เพื่อลดขนาดของไฟล์ ทำให้เราโหลดได้เร็วขึ้น
หรือถ้าเรามาดูว่าเราทำอะไรเสร็จไปแล้วก็อาจจะมีบอกว่าเราวางโค้ดเรียก css ได้ถูกที่แล้ว อะไรแบบนี้ครับ

Screen-Shot-2556-12-21-at-3.59.13-AM-300x248.png

หึหึ หวังว่าหลายๆท่านคงจะมีอะไรให้แก้ไขอีกเยอะเลยสินะครับ Y,Y ของผมตรึมตรัมเลยทีเดียว
ซึ่งบทความนี้ก็คงจะมีแค่นี้เองครับเพียงแค่แนะนำวิธีแก้ใช้เบื้องต้น แต่ในส่วนวิธีการแก้ไขต่างๆน่าจะมีในบทความต่อๆไปครับ
สุดท้ายในนี้ขอทิ้งท้ายหน่อยครับ ฮะๆ เนื้อหาบทความ วิธีการต่างๆ สามารถอ่านเพิ่มเติมได้ครับ ถ้ารีบ ฮะๆ
https://developers.google.com/speed/articles/optimizing-javascript ตามลิ้งนี้แนะนำวิธีการเขียน javascript ให้ได้ประสิทธิภาพสูงสุดครับ มีอย่างอื่นด้วย ทางผมเดียวจะนำมา เฉพาะบางส่วนที่ผมใช้บ่อยๆมาลงฮะๆ หวังว่าบทความนี้จะมีประโยชน์ต่อทุกๆคนนะครับ ^^ ขอบคุณที่ติดตามครับ

ภาพและบทความจาก silentclass.com
ตอบกลับ

ใช้ไอเท็ม รายงาน

  • ดันกระทู้
  • ปักหมุด
  • ล็อคกระทู้
  • คืนกระทู้
  • การ์ดสีสัน
  • การ์ดล่องหน
กลับไป



สารบัญเว็บไทย คำค้นยอดฮิต เพลงใหม่ ดารา Game Social Network โปรแกรมแต่งรูป สอนPhotoshop ภาพอาร์ต คำคมภาษาอังกฤษ โปรแกรมน่าดาวน์โหลด เว็บบอร์ด ติดต่อโฆษณา : admin@rnone.net แจ้งปัญหาการใช้งาน รูปแบบข้อความล้วน ใช้งานบนสมาร์ทโฟน สถิติเว็บไซต์
ติดต่อทีมงาน www.rnone.net
admin@rnone.net Tel.0909757272 Facebook Twitter Plus.google

รายชื่อผู้ถูกระงับบัญชี|โทรศัพท์มือถือ|รูปแบบข้อความล้วน|www.rnone.net

เว็บไซต์แนะนำ มือถือ โปรแกรม ดาวน์โหลด ไอที เทคโนโลยี

GMT+7, 2023-2-9 20:18 , Processed in 0.030927 second(s), 18 queries .

ตอบกระทู้ ขึ้นไปด้านบน ไปที่หน้ารายการกระทู้ Share To Facebook Share To Twitter Share To Google+ Share To ...