ไม่แสดงเนื้อหาสำรองเมื่อ JavaScript ไม่พร้อมใช้งาน

การเพิ่มประสิทธิภาพแบบต่อเนื่องคือกลยุทธ์การพัฒนาเว็บที่ทำให้แน่ใจว่าเว็บไซต์จะเข้าถึงกลุ่มเป้าหมายขนาดใหญ่ที่สุดเท่าที่จะเป็นไปได้ หลักการสำคัญคือเนื้อหาพื้นฐานและฟังก์ชันการทำงานของหน้าเว็บต้องพึ่งพาเทคโนโลยีเว็บพื้นฐานเท่านั้น ประสบการณ์การใช้งานที่ดียิ่งขึ้น เช่น การจัดรูปแบบที่ซับซ้อนโดยใช้ CSS หรือการโต้ตอบที่ใช้ JavaScript สามารถวางซ้อนกันได้สำหรับเบราว์เซอร์ที่รองรับเทคโนโลยีเหล่านั้น แต่เนื้อหาพื้นฐานและฟังก์ชันการทำงานของหน้าเว็บ ไม่ควรพึ่งพา CSS หรือ JavaScript

การตรวจสอบเนื้อหาสำรองของ Lighthouse ไม่สำเร็จได้อย่างไร

Lighthouse จะแจ้งหน้าที่ไม่มีเนื้อหาบางส่วนเมื่อ JavaScript ไม่พร้อมใช้งาน

หน้าแสดงการตรวจสอบ Lighthouse ไม่มีเนื้อหาบางอย่างเมื่อ JS ไม่พร้อมใช้งาน

Lighthouse จะปิดใช้ JavaScript ในหน้าเว็บแล้วตรวจสอบ HTML ของหน้าเว็บ หาก HTML ว่างเปล่า การตรวจสอบจะล้มเหลว

วิธีตรวจสอบให้แน่ใจว่าหน้าเว็บของคุณมีเนื้อหาโดยไม่มี JavaScript

การเพิ่มประสิทธิภาพแบบต่อเนื่องเป็นหัวข้อที่ถกเถียงกันในวงกว้าง ค่ายหนึ่งกล่าวว่า เพื่อให้สอดคล้องกับกลยุทธ์การเพิ่มประสิทธิภาพแบบต่อเนื่อง หน้าเว็บควรได้รับการแบ่งชั้นเพื่อให้เนื้อหาพื้นฐานและฟังก์ชันการทำงานของหน้าเว็บต้องใช้ HTML เท่านั้น ดูตัวอย่างของแนวทางนี้ได้ที่ การเพิ่มประสิทธิภาพแบบต่อเนื่อง: สิ่งที่เป็น และวิธีใช้ ของ Smashing Magazine

อีกค่ายหนึ่งเชื่อว่าวิธีการที่เข้มงวดนี้เป็นไปไม่ได้หรือไม่จำเป็นสำหรับเว็บแอปพลิเคชันขนาดใหญ่ที่ทันสมัยจำนวนมาก และแนะนำให้ใช้ CSS เส้นทางที่สำคัญในบรรทัดในเอกสาร <head> สำหรับรูปแบบหน้าเว็บที่สำคัญอย่างยิ่ง

จากการพิจารณาเหล่านี้ การตรวจสอบ Lighthouse นี้จะทำการตรวจสอบง่ายๆ เพื่อให้แน่ใจว่าหน้าเว็บไม่ว่างเปล่าเมื่อปิดใช้ JavaScript แอปของคุณปฏิบัติตามการปรับปรุงแบบต่อเนื่องอย่างเคร่งครัดเพียงใดซึ่งเป็นหัวข้อถกเถียงกัน แต่มีข้อตกลงในวงกว้างว่าทุกหน้าควรแสดงข้อมูลอย่างน้อยบางส่วนเมื่อปิดใช้ JavaScript แม้ว่าเนื้อหาดังกล่าวจะเป็นเพียงการแจ้งเตือนให้ผู้ใช้ทราบว่า JavaScript จำเป็นต้องมีเพื่อใช้ในหน้าเว็บ

สำหรับหน้าเว็บที่จำเป็นต้องใช้ JavaScript อย่างแน่นอน วิธีการหนึ่งคือการใช้องค์ประกอบ <noscript> เพื่อแจ้งเตือนผู้ใช้ว่าจำเป็นต้องใช้ JavaScript สำหรับหน้าเว็บนั้น วิธีนี้ดีกว่าหน้าว่างเนื่องจากหน้าว่างยังทำให้ผู้ใช้ไม่แน่ใจว่ามีปัญหาเกิดขึ้นกับหน้าเว็บ เบราว์เซอร์ หรือคอมพิวเตอร์ของผู้ใช้หรือไม่

หากต้องการดูหน้าตาและการทำงานของเว็บไซต์เมื่อปิดใช้ JavaScript ให้ใช้ฟีเจอร์ปิดใช้ JavaScript ของ Chrome DevTools

แหล่งข้อมูล