prerender = true สำหรับหน้าแบบสแตติก
ส่งออก prerender เพื่อสร้าง HTML แบบสแตติกสำหรับหน้าที่ไม่เปลี่ยนแปลงขณะรับคำขอ
prerender = true สำหรับหน้าแบบสแตติก เป็นบทเรียน Sveltejs Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Sveltejs Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Sveltejs Academy มีบทเรียนทั้งหมด 4 บทเรียน
การสร้างล่วงหน้าคืออะไร
การสร้างล่วงหน้าจะสร้าง HTML แบบคงที่ในเวลาสร้างสำหรับหน้าที่ไม่เปลี่ยนแปลงตามแต่ละคำขอ
เปิดใช้แยกตามหน้า
ส่งออก prerender = true จาก +page.js หรือ +page.server.js
export const prerender = true;ทั้งเว็บไซต์
กำหนด prerender ที่เลย์เอาต์รากเพื่อเปิดใช้กับทุกส่วนเป็นค่าเริ่มต้น
// +layout.js
export const prerender = true;เส้นทางแบบไดนามิก
ระบุ entries เพื่อแสดงค่าของพารามิเตอร์แบบไดนามิกทั้งหมด
export function entries() { return [{ slug: "hello" }, { slug: "world" }]; }ค้นหาอัตโนมัติ
SvelteKit จะติดตามลิงก์ระหว่างการสร้างล่วงหน้า เพื่อค้นหาเส้นทางเพิ่มเติมโดยอัตโนมัติ
โฮสต์แบบคงที่
ผลลัพธ์ที่สร้างล่วงหน้าทำงานบนโฮสต์แบบคงที่ใดก็ได้ และสามารถใช้ร่วมกับ adapter-static เพื่อสร้างเว็บไซต์แบบคงที่ทั้งหมด
แอปแบบผสม
ผสมหน้าการตลาดที่สร้างล่วงหน้าเข้ากับหน้าแอปแบบไดนามิกในโครงการ SvelteKit เดียวกัน
ต้นทุนในเวลาสร้าง
เส้นทางแบบไดนามิกจำนวนมากทำให้การสร้างใช้เวลานานขึ้น หากมีขนาดใหญ่มาก ควรสร้างล่วงหน้าเฉพาะส่วนที่จำเป็น
เหมาะสำหรับ
การตลาด เอกสาร บล็อก และหน้าสินค้าอีคอมเมิร์ซที่มีข้อมูลคงที่
ควรหลีกเลี่ยงสำหรับ
แดชบอร์ดเฉพาะบุคคล ข้อมูลแบบเรียลไทม์ และสิ่งใดก็ตามที่แตกต่างกันไปตามผู้ใช้
การทำให้ข้อมูลไม่เป็นปัจจุบัน
การสร้างล่วงหน้าแบบคงที่ต้องสร้างใหม่เพื่อรีเฟรชเนื้อหา ควรใช้ร่วมกับ ISR หรือ API สำหรับตรวจสอบข้อมูลใหม่เพื่อให้ได้ข้อมูลล่าสุด
ตรวจสอบความเข้าใจ
คุณเปิดใช้การสร้างล่วงหน้าสำหรับหน้าเว็บอย่างไร
ทบทวน
ส่งออก prerender = true เพื่อสร้าง HTML แบบคงที่ในเวลาสร้าง ทำให้ได้หน้าที่รวดเร็วและแคชได้
คำถามที่พบบ่อย
บทเรียน “prerender = true สำหรับหน้าแบบสแตติก” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “prerender = true สำหรับหน้าแบบสแตติก” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Sveltejs Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Sveltejs Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “prerender = true สำหรับหน้าแบบสแตติก”
ส่งออก prerender เพื่อสร้าง HTML แบบสแตติกสำหรับหน้าที่ไม่เปลี่ยนแปลงขณะรับคำขอ คุณปฏิบัติ Sveltejs Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Sveltejs Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน Sveltejs Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน
บทเรียน “prerender = true สำหรับหน้าแบบสแตติก” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน Sveltejs Academy นี้ได้ไหม
ได้ บทเรียน Sveltejs Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- load แบบสากลเทียบกับแบบเซิร์ฟเวอร์เท่านั้น
- prerender = true สำหรับหน้าแบบสแตติก
- ssr = false สำหรับหน้าไคลเอ็นต์เท่านั้น
- สถาปัตยกรรมแบบเกาะ