อ่านบทความจาก sitepoint เรื่อง Average Page Weight Increases 15% in 2014
ซึ่งได้ทำการสรุปข้อมูลของขนาด web page ที่ใช้งานโดยเฉลี่ยทุกปี
โดยนำข้อมูลมากจาก HTTP Archive Report
มาดูกันว่าปี 2014 มีผลอย่างไรบ้าง ?
HTTP Archive Report เป็น web ที่ทำการรวบรวมข้อมูลข้อมูล
การใช้งานของ web ที่ได้รับความนิยมมากกว่า 500,000 แห่งทั่วโลก
ในปี 2014 ได้ข้อสรุปว่า
ขนาดโดยเฉลี่ยของ web จะเพิ่มขึ้น 15% จากปี 2013 ( เพิ่มจาก 1,701 KB มาเป็น 1,953 KB )
นั่นคือเกือบจะ 2MB แล้วนะ
ในแต่ละหน้า web ทำการสร้าง request จำนวนเฉลี่ย 95 request
แต่ถ้าเทียบในปี 2013 แล้วนั้นอัตราการเติบโตในปีนี้จะน้อยกว่า
แล้วสิ่งที่เราในฐานนะนักพัฒนา ต้องสนใจอะไรล่ะ ?
จำนวน URL ที่ทำการจัดเก็บข้อมูล
พบว่ามีข้อมูลของ URL หรือ web จำนวนกว่า 500,000 แห่ง
ยิ่งข้อมูลเยอะเท่าไร ความถูกต้องของรายงานก็จะถูกต้องมากขึ้นเท่านั้น
ขนาดของการ transfer ข้อมูล และจำนวน request ของแต่ละ web
สิ่งที่น่าสนใจก็คือ ขนาดของการ transfer ข้อมูลที่มีขนาดใหญ่ขึ้นกว่าเดิม 15%
และเมื่อดูจากแนวโน้มแล้ว พบว่า มันจะยังขึ้นต่อไปอีกเรื่อยๆ
จากขนาดข้อมูลที่ใหญ่ขึ้นนั้น เรามาดูในรายละเอียดสิว่าเป็นอย่างไร
- HTML มีขนาดใหญ่ขึ้น 4% จาก 57KB เป็น 59KB
- CSS มีขนาดใหญ่ขึ้น 24% จาก 46KB เป็น 57KB
- JavaScript มีขนาดใหญ่ขึ้น 7% จาก 276KB เป็น 295KB
- Image มีขนาดใหญ่ขึ้น 21% จาก 1,030KB เป็น 1,243KB
- Flash มีขนาดเล็กลง 13%
- อื่นๆ มีขนาดใหญ่ขึ้น 9% เช่นพวก font
ทำให้ผลโดยรวมมีอัตราที่สูงขึ้น 15%
สิ่งที่น่าสนใจสำหรับรายงานนี้คือ
ขนาดของ CSS ที่เพิ่มขึ้น 11KB
มันบอกอะไรเราล่ะ ?
ในการออกแบบ web แบบ responsive มีการใช้งาน CSS3 annimation มากขึ้นหรือไม่ ?
แต่พบว่าขนาดของ JavaScript กลับไม่ลดลง มันยังไงกัน ?
รวมทั้งในปัจจุบันมีเครื่องมือช่วยจัดการ CSS และช่วยลดขนาดของ CSS อีกต่างหาก
แต่ขนาดของ CSS ดันเพิ่มขึ้นซะงั้น
และพบว่าในแต่ละ web มีการส่ง request ไปดึงข้อมูลโดยเฉลี่ย 6 ครั้ง
เพิ่มขึ้นจากเดิมประมาณ 1 ครั้งเลยนะ
ส่วนที่น่าตกใจก็คือ ขนาดของ JavaScript ที่ใหญ่ขึ้น 19KB
อย่างที่อธิบายไป ว่ามันขัดแย้งกับ CSS นะ
ยังไม่พอ พบว่ามีการส่ง request เพื่อดึงข้อมูล JavaScript โดยเฉลี่ย 18 ครั้ง
มันบอกอะไรเราล่ะ ?
พบว่ามีการเขียน JavaScript มากขึ้น ?
พบว่ามีการใช้งาน script ต่างๆ ของ Social network มากขึ้น ?
ขนาดของรูปที่ใหญ่ขึ้น แต่จำนวน request กลับเท่าเดิม
สิ่งที่อาจจะบอกเราได้ก็คือ ความละเอียดของ device ต่างๆ มันละเอียดขึ้น
ทำให้รูปที่ใช้ใน web มีความละเอียดสูง นั่นส่งผลต่อขนาดรูปเช่นกัน
แต่เราสามารถลดมันลงได้นะ เช่น
- แต่ละหน้าดึงข้อมูลรูปกว่า 50 รูป มันเยอะไปนะ ลดได้ไหม ?
- สามารถใช้ SVG, Icon font และ CSS3 มาแทนที่รูปภาพได้นะ
- มีเครื่องมือช่วยลดขนาดรูปได้นะ เช่น TinyPNG
จากรายงานข้างต้นคิดว่า ปัญหาหลักๆ คืออะไร ?
ในรอบ 12 เดือน bandwidth ของ internet ที่เราใช้งานใหญ่ขึ้น 15% ไหม ?
ผู้ใช้งานกลุ่มที่ 3 มาจาก mobile ใช่ไหม ? และเยอะด้วย
แล้วทำไมขนาดของ web จึงใหญ่ขึ้นล่ะ ?
ถ้าขนาดของ web ยังโตในลักษณะนี้มันจะส่งผลอย่างไรบ้างล่ะ ?
- ผู้ใช้งานจะเข้าถึง web ช้าลง นั่นคือ ประสบการณ์การใช้งานที่แย่ๆ มันไม่ดีเนาะ ที่ให้ผู้ใช้งานรอ
- ถ้าขนาด web คือ 2MB ลองคิดดูสิ เข้าผ่าน mobile มันจะช้าไหม ? แสดงว่า Responsive Web Design มันไม่เท่ากับ Responsive web นะ คุณอาจจะต้องเสียลูกค้ากลุ่ม mobile ไปเลยนะ
- ถ้า web คุณช้าแล้ว Google ก็จะลดความสำคัญของ web ใน SEO ลงไปแน่นอน
- แสดงว่าคุณต้องซื้อ bandwidth สูงขึ้น นั่นคือค่าใช้จ่ายที่สูงขึ้น
- code ที่คุณเขียนเยอะขึ้น ความซับซ้อนสูงขึ้น การแก้ไขก็ใช้เวลาและค่าใช้จ่ายสูงขึ้น
ปัญหาเหล่านี้มันมาจากสาเหตุอะไรล่ะ ?
สรุปด้วยคำสั้นๆ ง่ายๆ คือ ความขี้เกียจ ไงล่ะ
นักพัฒนาไม่ได้สนใจ และ ใส่ใจ ในรายละเอียดเลย
และนักพัฒนาจะมีคำแก้ตัวไว้เสมอ ดังนี้
- ไม่มีเวลา
- ลูกค้าเขาต้องการแบบนี้
- ทั้งงบ และ ตารางเวลา ของการพัฒนามันบีบรัดมากๆ
- ระบบเดิมมันเป็นอย่างนี้นะ
- เราไม่มีเครื่องมือที่ดีพอ
- Framework หรือ Library ที่เราใช้มันจัดการให้แบบนี้เอง
ไม่ว่าจะมีเหตุผลใดๆ มาอ้างก็ตาม เรานั่นแหละที่ขี้เกียจเอง
ทำไมเรายังสร้างปัญหาขึ้นมาล่ะ ?
ทั้งๆ ที่มันมีวิธีทำที่ง่ายแสนง่าย เช่น The Complete Guide to Reducing Page Weight
ทำไมเราถึงไม่ทำกันล่ะ มันใช้เวลามากนักหรือไง ?
และเชื่อเถอะว่า ลูกค้าของคุณไม่รู้หรอกว่า
จริงๆ แล้วสิ่งที่คุณทำ หรือ สร้างขึ้นมา มันเป็นอย่างไรทั้งหมด
แต่ด้วยคุณเป็นนักพัฒนา ที่มีความเชี่ยวชาญ
ควรต้องให้ความสนใจและใส่ใจในเรื่องขนาดของ web ที่สร้างขึ้นมา
เพื่อให้มีขนาดเล็กที่สุดเท่าที่จะเป็นไปได้
นั่นคือสิ่งที่สำคัญมาก สำหรับงานที่คุณทำ
มาทำให้มันดีขึ้นเถอะครับ
