บทนำ
การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะเป็นกลไกใหม่ใน Chrome ที่ใช้แทนกระบวนการแสดงผลล่วงหน้าที่เลิกใช้งานแล้ว ซึ่งใช้เพื่อขับเคลื่อนฟีเจอร์ต่างๆ เช่น <link rel="prerender">
เช่นเดียวกับการแสดงผลล่วงหน้า ฟีเจอร์นี้จะดึงข้อมูลทรัพยากรล่วงหน้า แต่จะไม่เรียกใช้ JavaScript หรือแสดงผลส่วนใดๆ ของหน้าเว็บล่วงหน้า เป้าหมายของ NoState
Prefetch คือการใช้หน่วยความจําน้อยกว่าการแสดงผลล่วงหน้า ในขณะที่ยังคงลดเวลาในการโหลดหน้าเว็บ
NoState Prefetch ไม่ใช่ API แต่เป็นกลไกที่ Chrome ใช้เพื่อติดตั้งใช้งาน API และฟีเจอร์ต่างๆ Resource Hints API รวมถึงการเรียกข้อมูลหน้าเว็บล่วงหน้าโดยแถบที่อยู่ของ Chrome ต่างก็ใช้งานโดยใช้การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะ หากคุณใช้ Chrome 63 ขึ้นไป เบราว์เซอร์จะใช้การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะสำหรับฟีเจอร์อย่าง <link rel="prerender">
อยู่แล้ว
บทความนี้อธิบายวิธีการทํางานของ NoStatePrefetch แรงจูงใจในการนำ NoStatePrefetch มาใช้ และวิธีใช้ผังความถี่ของ Chrome เพื่อดูสถิติเกี่ยวกับการใช้งาน
แรงจูงใจ
เรามีเหตุผลหลัก 2 ข้อในการเปิดตัวการเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะ
ลดการใช้หน่วยความจำ
NoState Prefetch ใช้หน่วยความจําเพียงประมาณ 45MiB การดูแลรักษาเครื่องมือสแกนการโหลดล่วงหน้าเป็นค่าใช้จ่ายหลักของหน่วยความจำสําหรับการเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะ และค่าใช้จ่ายนี้จะค่อนข้างคงที่ใน Use Case ต่างๆ การเพิ่มขนาดหรือปริมาณการดึงข้อมูลไม่มีผลมากนักต่อปริมาณหน่วยความจําที่ NoState Prefetch ใช้
ในทางตรงกันข้าม การแสดงผลล่วงหน้ามักใช้หน่วยความจํา 100MiB และมีการจำกัดการใช้หน่วยความจําไว้ที่ 150MiB การใช้หน่วยความจำสูงนี้ทำให้ไม่เหมาะกับอุปกรณ์ระดับล่าง (เช่น RAM น้อยกว่าหรือเท่ากับ 512 MB) ด้วยเหตุนี้ Chrome จึงไม่แสดงผลล่วงหน้าในอุปกรณ์ระดับล่าง แต่จะเชื่อมต่อล่วงหน้าแทน
อำนวยความสะดวกในการสนับสนุนฟีเจอร์ใหม่ของแพลตฟอร์มเว็บ
เมื่อใช้การแสดงผลล่วงหน้า ไม่ควรมีการดำเนินการที่แสดงต่อผู้ใช้ (เช่น การเล่นเพลงหรือวิดีโอ) หรือการดำเนินการที่มีสถานะ (เช่น การเปลี่ยนแปลงเซสชันหรือพื้นที่เก็บข้อมูลในเครื่อง) อย่างไรก็ตาม การป้องกันการดําเนินการเหล่านี้ไม่ให้เกิดขึ้นขณะแสดงผลหน้าเว็บนั้นเป็นเรื่องยากและซับซ้อน NoState Prefetch จะดึงข้อมูลทรัพยากรล่วงหน้าเท่านั้น โดยจะไม่เรียกใช้โค้ดหรือแสดงผลหน้าเว็บ วิธีนี้ช่วยให้ป้องกันการดำเนินการที่แสดงต่อผู้ใช้และการดำเนินการที่มีสถานะเกิดขึ้นได้ง่ายขึ้น
การใช้งาน
ขั้นตอนต่อไปนี้จะอธิบายวิธีการทํางานของ NoState Prefetch
NoStatePrefetch ได้รับการเรียกให้แสดง
คำแนะนำทรัพยากรการประมวลผลล่วงหน้า (เช่น
<link rel="prerender">
) และฟีเจอร์บางอย่างของ Chrome จะทริกเกอร์การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะในกรณีที่เป็นไปตามเงื่อนไข 2 ข้อต่อไปนี้ กล่าวคือ ผู้ใช้ไม่ได้ใช้อุปกรณ์ระดับล่าง และผู้ใช้ไม่ได้ใช้เครือข่ายมือถือระบบจะสร้างโปรแกรมแสดงผลใหม่สำหรับ NoState Prefetch
ใน Chrome "โปรแกรมแสดงผล" เป็นกระบวนการที่มีหน้าที่นำเอกสาร HTML มาแยกวิเคราะห์ สร้างโครงสร้างการแสดงผล และแสดงผลลัพธ์บนหน้าจอ แต่ละแท็บใน Chrome รวมถึงกระบวนการ Prefetch แบบ NoState แต่ละรายการจะมีโปรแกรมแสดงผลของตนเองเพื่อแยกการทำงาน ซึ่งจะช่วยลดความสําคัญของสิ่งที่ผิดพลาด (เช่น แท็บขัดข้อง) รวมถึงป้องกันไม่ให้โค้ดที่เป็นอันตรายเข้าถึงแท็บอื่นๆ หรือส่วนอื่นๆ ของระบบ
ระบบจะดึงข้อมูลทรัพยากรที่โหลดด้วย NoState Prefetch จากนั้น HTMLPreloadScanner จะสแกนทรัพยากรนี้เพื่อค้นหาทรัพยากรย่อยที่ต้องดึงข้อมูล หากทรัพยากรหลักหรือทรัพยากรย่อยมี Service Worker ที่ลงทะเบียนไว้ คำขอเหล่านี้จะส่งผ่าน Service Worker ที่เหมาะสม
การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะรองรับเฉพาะเมธอด GET ของ HTTP เท่านั้น จะไม่ดึงข้อมูลทรัพยากรย่อยที่ต้องใช้เมธอด HTTP อื่นๆ นอกจากนี้ ระบบจะไม่ดึงข้อมูลทรัพยากรที่กําหนดให้ผู้ใช้ดำเนินการ (เช่น ป๊อปอัปการตรวจสอบสิทธิ์ ใบรับรองไคลเอ็นต์ SSL หรือการลบล้างด้วยตนเอง)
ระบบจะดึงข้อมูลย่อยที่ดึงข้อมูลด้วยลําดับความสําคัญสุทธิ "ว่าง"
ลำดับความสำคัญสุทธิ "ไม่มีการใช้งาน" คือลำดับความสำคัญสุทธิต่ำสุดที่เป็นไปได้ใน Chrome
ระบบจะแคชทรัพยากรทั้งหมดที่ดึงข้อมูลโดย NoState Prefetch ตามส่วนหัวแคชของทรัพยากรเหล่านั้น
NoState Prefetch จะแคชทรัพยากรทั้งหมดยกเว้นทรัพยากรที่มีส่วนหัว
no-store
Cache-Control ระบบจะตรวจสอบทรัพยากรอีกครั้งก่อนใช้งานหากมีVary
ส่วนหัวคำตอบno-cache
ส่วนหัว Cache-Control หรือหากทรัพยากรมีอายุมากกว่า 5 นาทีโปรแกรมแสดงผลจะหยุดทำงานหลังจากโหลดทรัพยากรย่อยทั้งหมดแล้ว
หากทรัพยากรย่อยหมดเวลา ระบบจะหยุดการทำงานของโปรแกรมแสดงผลหลังจากผ่านไป 30 วินาที
เบราว์เซอร์จะไม่แก้ไขสถานะใดๆ นอกเหนือจากการอัปเดตที่เก็บคุกกี้และแคช DNS ในเครื่อง เราขออธิบายเรื่องนี้เนื่องจาก "NoState" ใน "NoState Prefetch"
ณ จุดนี้ในกระบวนการโหลดหน้าเว็บ "ปกติ" เบราว์เซอร์อาจทําสิ่งต่างๆ ที่จะแก้ไขสถานะเบราว์เซอร์ เช่น เรียกใช้ JavaScript, เปลี่ยนรูปแบบ
sessionStorage
หรือlocalStorage
, เล่นเพลงหรือวิดีโอ, ใช้ History API หรือแจ้งให้ผู้ใช้ทราบ การแก้ไขสถานะที่เกิดขึ้นใน NoState Prefetch คือการอัปเดตแคช DNS เมื่อได้รับคำตอบ และการอัปเดตที่เก็บคุกกี้หากคำตอบมีส่วนหัวSet-Cookie
เมื่อระบบต้องการทรัพยากร ระบบจะโหลดทรัพยากรนั้นลงในหน้าต่างเบราว์เซอร์
อย่างไรก็ตาม หน้าเว็บจะไม่ปรากฏขึ้นทันที แต่จะยังต้องได้รับการแสดงผลโดยเบราว์เซอร์ ซึ่งแตกต่างจากหน้าที่แสดงผลล่วงหน้า เบราว์เซอร์จะไม่ใช้โปรแกรมแสดงผลที่ใช้สำหรับการแสดงผลล่วงหน้าแบบไม่มีสถานะซ้ำอีก แต่จะเปลี่ยนไปใช้โปรแกรมแสดงผลใหม่แทน การไม่แสดงผลหน้าเว็บล่วงหน้าจะช่วยลดการใช้หน่วยความจําของ NoStatePrefetch แต่ก็ลดผลกระทบที่อาจเกิดขึ้นกับเวลาในการโหลดหน้าเว็บด้วย
หากหน้าเว็บมี Service Worker การโหลดหน้าเว็บนี้จะผ่าน Service Worker อีกครั้ง
หากการเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะยังไม่เสร็จสิ้นเมื่อถึงเวลาที่ต้องใช้หน้าเว็บ เบราว์เซอร์จะดำเนินการโหลดหน้าเว็บต่อจากจุดที่การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะหยุดไว้ เบราว์เซอร์จะยังคงต้องเรียกข้อมูลทรัพยากร แต่จะไม่มากเท่ากับกรณีที่ไม่ได้เริ่มการเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะ
ผลกระทบต่อ Web Analytics
เครื่องมือวิเคราะห์เว็บจะบันทึกหน้าที่โหลดโดยใช้การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะในเวลาที่ต่างกันเล็กน้อย ขึ้นอยู่กับว่าเครื่องมือรวบรวมข้อมูลฝั่งไคลเอ็นต์หรือฝั่งเซิร์ฟเวอร์
สคริปต์ข้อมูลวิเคราะห์ฝั่งไคลเอ็นต์จะบันทึกการดูหน้าเว็บเมื่อหน้าเว็บแสดงต่อผู้ใช้ สคริปต์เหล่านี้อาศัยการเรียกใช้ JavaScript และ NoState Prefetch จะไม่เรียกใช้ JavaScript ใดๆ
เครื่องมือวิเคราะห์ฝั่งเซิร์ฟเวอร์จะบันทึกเมตริกเมื่อจัดการคําขอ สําหรับทรัพยากรที่โหลดผ่าน prefetch แบบ NoState อาจมีช่วงเวลาที่นานมากระหว่างที่ระบบจัดการคําขอกับเวลาที่ไคลเอ็นต์ใช้การตอบกลับจริง (หากมีการใช้) ตั้งแต่ Chrome 69 เป็นต้นไป การเรียกข้อมูลล่วงหน้าแบบไม่มีสถานะจะเพิ่มส่วนหัว Purpose: Prefetch
ลงในคำขอทั้งหมดเพื่อให้แยกความแตกต่างจากการท่องเว็บตามปกติได้
ดูเลย
NoStatePrefetch พร้อมใช้งานในเดือนธันวาคม 2017 ใน Chrome 63 ปัจจุบันมีการใช้เพื่อดำเนินการต่อไปนี้
- ใช้คำแนะนำทรัพยากร
prerender
- ดึงข้อมูลผลการค้นหาแรกในผลการค้นหาของ Google
- ดึงข้อมูลหน้าที่แถบที่อยู่ของ Chrome คาดการณ์ว่ามีโอกาสที่จะเข้าชมในลำดับถัดไป
คุณสามารถใช้ข้อมูลภายในของ Chrome เพื่อดูวิธีใช้ NoStatePrefetch
หากต้องการดูรายการเว็บไซต์ที่โหลดด้วยการโหลดล่วงหน้าแบบไม่มีสถานะ ให้ไปที่ chrome://net-internals/#prerender
หากต้องการดูสถิติเกี่ยวกับการใช้งาน NoStatePrefetch ให้ไปที่ chrome://histograms แล้วค้นหา "NoStatePrefetch" โดย NoStatePrefetch มีฮิสโตแกรม 3 แบบที่แตกต่างกัน 1 แบบสำหรับแต่ละ Use Case ของ NoStatePrefetch ดังนี้
- "NoStatePrefetch" (สถิติการใช้งานตามคำแนะนำทรัพยากรการแสดงผลล่วงหน้า)
- "gws_NoStatePrefetch" (สถิติการใช้งานโดยหน้าผลการค้นหาของ Google)
- "omnibox_NoStatePrefetch" (สถิติการใช้งานแถบที่อยู่ของ Chrome)