ต่อกันด้วยอีกเรื่องน่าสนใจจากห้อง Geek ในหัวข้อ Web Optimize 4.0 For Mobile สำหรับเจ้าของเว็บไซต์ในยุคปัจจุบัน ที่ต้องออกสู่ตลาดผ่านแพลตฟอร์ม Mobile เป็นหลัก
โดยคุณจักรกฤษณ์ ตาฬวัตน์ Managing Director ของ Seed Themes Co., Ltd. ผู้บุกเบิกวงการ Wordpress ในประเทศไทย
.
-เว็บไซต์ต้องโหลดไว เพราะถ้าเว็บช้า = อันดับร่วง ซึ่ง Google ประกาศว่าโดยเฉลี่ยทั้งโลก เว็บที่จะติดหน้าแรกต้องโหลดให้ทันภายใน 2-3 วินาที
-เว็บช้า = คนหนี Bounce rate คนเข้ามาแล้วออกไม่ไปหน้าอื่น ถ้าเว็บโหลดช้าเกิน 10 วินาที 100% คนจะออกไปเลย และไม่ติด Google
-เว็บช้า = ยอดขายตก สถิติระดับโลกบอกว่า เว็บขายของช้าลง 0.01 วินาที Conversion rate หาย 7%
-เว็บช้า = Ads แพง Google มีการเช็คคุณภาพโฆษณา ถ้าคนคลิกง่าย รันไว Google จะลดราคาให้ แค่ถ้าเว็บถูกออกแบบมาไม่ดี Google จะกดดันให้เราพัฒนาเว็บให้น่าใช้ เพื่อโฆษณาจะได้มีประสิทธิภาพมากขึ้น
-คนกว่า 80% เข้าเว็บผ่านมือถือ แต่คนทำเว็บส่วนใหญ่เริ่มจากคอมพิวเตอร์ เราจึงควรทำเว็บให้เร็ว
.
-โดยเราสามารถดูว่าเว็บเราเร็วแค่ไหนด้วย Google PageSpeed และ GTmetrix โดยจะมีวิธีแก้ให้ด้วย
.
ทำให้เว็บโหลดเร็วขึ้นอย่างไร
1. Web App - Cache โหลดหน้าเดิมสำหรับการใช้ซ้ำ ไม่ต้องประมวลผลใหม่ / Minify ย่อไฟล์ให้เล็กลง
2. Server - Cache
3. Internet - CDN วิ่งไปโหลดตามภูมิภาคใกล้เคียงตัวเอง
4. Browser - Browser Caching เก็บหน้าเดิมไว้ในเครื่อง ไม่ต้องโหลดใหม่
.
เว็บแสดงผลยังไง ให้เร็วขึ้น
1. เลือกเซิร์ฟเวอร์ที่สามารถโหลดเว็บได้เร็วที่สุด
2. เลือกขนาดไฟล์ที่สามารถโหลดได้เร็วที่สุด
3. เรนเดอร์ เลือกข้างบนก่อน
4. โหลดโครงสร้างหน้า
5. โหลดเสร็จทั้งหน้า
6. โหลดด้านล่างที่เหลือ
.
-ลูกค้าทั่วโลก เลือกเซิร์ฟเวอร์ที่สิงคโปร์
-ใช้ Cloudflare CDN
-Above the fold เลือกสำคัญโหลดแต่ละหน้า โหลดรูปเมื่อถึงระยะ
-Render blocking หยิบของไปโหลดด้านล่าง ทำยากแต่เห็นผลชัด
-ควรเลิกใช้ Carousel เพราะคนที่เข้าก็จะไม่เลื่อนดู ควรแสดงผลในสิ่งที่อยากโชว์เลย
-เลิกใช้ JQuery เพราะมันไปก็อปเว็บไซต์คนอื่น ทำให้เสียเวลาไป 0.5-1 วินาที จะต้องเว็บเขียนใหม่ถึงทำได้
.
ทั้งหมดที่กล่าวมาอาจฟังดูยาก เพราะฉะนั้นแนะนำให้หันไปใช้ WordPress ก็จะสามารถแก้ปัญหาได้ทุกอย่างในทีเดียวเลย
.
#iCreatorConference2019
「jquery cdn」的推薦目錄:
- 關於jquery cdn 在 โปรแกรมเมอร์ไทย Thai programmer Facebook 的最佳解答
- 關於jquery cdn 在 Blogger調校資料庫 Facebook 的最佳貼文
- 關於jquery cdn 在 Blogger調校資料庫 Facebook 的最佳貼文
- 關於jquery cdn 在 kenn/jquery-rails-cdn - GitHub 的評價
- 關於jquery cdn 在 Microsoft CDN for jQuery or Google CDN? - Stack Overflow 的評價
- 關於jquery cdn 在 jQuery CDN misssing - javascript - Drupal Answers 的評價
- 關於jquery cdn 在 jQuery Implementation with CDN Tutorial in Hindi / Urdu 的評價
jquery cdn 在 Blogger調校資料庫 Facebook 的最佳貼文
如果需要在網頁上展示一系列、或一整個相簿的圖片,可使用這個免費、又十分專業的外掛。他的排版效果可以超乎想像,各種型態都做的出來,而且展示個別圖片的燈箱效果也不含糊,非常值得推薦。
jquery cdn 在 Blogger調校資料庫 Facebook 的最佳貼文
專業又有質感的網頁文章註解外掛 BigFoot﹍CDN 安裝懶人包
BigFoot 是一個效果很棒的 jQuery 註腳外掛,不過在 Google Drive 不支援外連後,這個外掛安裝上就比較麻煩。本篇介紹 CDN 安裝方式,不用另外下載檔案放到自己的網路空間,還能有更快的網路傳輸速度。
jquery cdn 在 jQuery CDN misssing - javascript - Drupal Answers 的推薦與評價
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js". But I could not see jQuery anywhere neither inside <head> tag ... ... <看更多>
jquery cdn 在 kenn/jquery-rails-cdn - GitHub 的推薦與評價
Add CDN support to jquery-rails. Contribute to kenn/jquery-rails-cdn development by creating an account on GitHub. ... <看更多>