การปรับแต่งประสิทธิภาพ
OnPush strategy, trackBy, virtual scrolling, lazy loading, preloading, bundle size, Core Web Vitals, profiling
1กลยุทธ์ OnPush ใน Angular คืออะไร?
กลยุทธ์ OnPush ใน Angular คืออะไร?
คำตอบ
OnPush เป็นกลยุทธ์ change detection ที่จำกัดการตรวจสอบเฉพาะกรณีที่ input ของคอมโพเนนต์เปลี่ยนแปลงโดยการอ้างอิงหรือเมื่อมีเหตุการณ์ภายในเกิดขึ้น การปรับแต่งนี้ลดจำนวนรอบการตรวจจับในแอปพลิเคชันที่ซับซ้อนได้อย่างมาก การใช้ OnPush เป็นค่าเริ่มต้นกับคอมโพเนนต์เชิงนำเสนอเป็นแนวทางปฏิบัติที่ดีที่สุดสำหรับการปรับปรุงประสิทธิภาพ
2บทบาทหลักของ trackBy ในไดเรกทีฟ ngFor คืออะไร?
บทบาทหลักของ trackBy ในไดเรกทีฟ ngFor คืออะไร?
คำตอบ
trackBy ช่วยให้ Angular ระบุแต่ละรายการในลิสต์ได้อย่างไม่ซ้ำกัน จึงหลีกเลี่ยงการสร้าง DOM ใหม่ทั้งหมดในระหว่างการอัปเดต หากไม่มี trackBy Angular จะทำลายและสร้างองค์ประกอบทั้งหมดใหม่แม้ว่าจะมีการเปลี่ยนแปลงเพียงรายการเดียว การใช้ trackBy กับตัวระบุที่ไม่ซ้ำกันช่วยปรับปรุงประสิทธิภาพของลิสต์แบบไดนามิกได้อย่างมาก
3lazy loading ในบริบทของ routing ของ Angular คืออะไร?
lazy loading ในบริบทของ routing ของ Angular คืออะไร?
คำตอบ
lazy loading เป็นเทคนิคการโหลดโมดูลแบบเลื่อนเวลาที่ดาวน์โหลดโค้ดเฉพาะเมื่อเส้นทางที่เกี่ยวข้องถูกเปิดใช้งาน สิ่งนี้ช่วยลดขนาด bundle เริ่มต้นและเร่งความเร็วในการแสดงผลครั้งแรกของแอปพลิเคชัน โมดูลที่ lazy load จะถูกกำหนดด้วย loadChildren ในการกำหนดค่าเส้นทาง
ควรเรียกเมธอดใดเพื่อบังคับการตรวจสอบด้วย OnPush?
ข้อได้เปรียบหลักของ virtual scrolling สำหรับลิสต์ขนาดใหญ่คืออะไร?
+19 คำถามสัมภาษณ์
หัวข้อสัมภาษณ์ Angular อื่นๆ
พื้นฐาน TypeScript
TypeScript ขั้นสูง
พื้นฐาน Angular
คอมโพเนนต์และวงจรชีวิต
Services & Dependency Injection
การจัดระเบียบโมดูล Angular
Angular CLI
Directives และ Pipes
Routing และการนำทาง
Reactive Forms
Template-driven Forms
พื้นฐาน RxJS
Operator ของ RxJS
HttpClient และการเรียก API
การจัดการ state พื้นฐาน
Change Detection
Angular Signals
Standalone Components
การทำ Unit Testing ใน Angular
การทดสอบ End-to-End
Build และการเพิ่มประสิทธิภาพ
พื้นฐาน NgRx
NgRx ขั้นสูง
สถาปัตยกรรม Angular
ความปลอดภัยและแนวทางปฏิบัติที่ดี
รูปแบบ RxJS ขั้นสูง
Angular Universal และ SSR
Angular Micro-frontends
เชี่ยวชาญ Angular สำหรับการสัมภาษณ์ครั้งถัดไป
เข้าถึงคำถามทั้งหมด flashcards แบบทดสอบเทคนิค แบบฝึกหัด code review และตัวจำลองสัมภาษณ์
เริ่มใช้ฟรี