Build และการเพิ่มประสิทธิภาพ
Production builds, AOT compilation, tree shaking, lazy loading, การเพิ่มประสิทธิภาพ bundle, source maps, budgets
1AOT compilation ใน Angular คืออะไร?
AOT compilation ใน Angular คืออะไร?
คำตอบ
AOT (Ahead-of-Time) compilation แปลงโค้ด Angular และ templates เป็น JavaScript ที่ปรับให้เหมาะสมในช่วง build ก่อนการ deploy ซึ่งช่วยลดขนาด bundle เนื่องจากไม่มี Angular compiler รวมอยู่ ปรับปรุงประสิทธิภาพการโหลด และตรวจจับข้อผิดพลาดของ template ได้เร็วขึ้น ตั้งแต่ Angular 9 เป็นต้นมา AOT จะเปิดใช้งานเป็นค่าเริ่มต้นสำหรับทุก build
2ข้อได้เปรียบหลักของ AOT เมื่อเทียบกับ JIT compilation คืออะไร?
ข้อได้เปรียบหลักของ AOT เมื่อเทียบกับ JIT compilation คืออะไร?
คำตอบ
AOT สร้าง bundle ที่เล็กกว่าเพราะ Angular compiler (ประมาณ 1MB) ถูกแยกออกจาก bundle สุดท้าย ต่างจาก JIT ที่ต้องการ compiler ในเบราว์เซอร์ AOT ยังปรับปรุงเวลาโหลดโดยขจัดขั้นตอน compilation ฝั่ง client ตรวจจับข้อผิดพลาดของ template ได้เร็วขึ้น และปรับปรุงความปลอดภัยโดยการ pre-compile templates
3วิธีเปิดใช้งาน AOT compilation ในคำสั่ง ng build อย่างไร?
วิธีเปิดใช้งาน AOT compilation ในคำสั่ง ng build อย่างไร?
คำตอบ
ตั้งแต่ Angular 9 AOT เป็น compilation ค่าเริ่มต้นสำหรับทุก environment สำหรับ production build การใช้ ng build --configuration production จะเปิดใช้งาน AOT โดยอัตโนมัติ flag --aot มีอยู่แต่ซ้ำซ้อนเพราะ AOT จะทำงานเสมอเว้นแต่จะกำหนดค่าไว้อย่างชัดเจนใน angular.json
การกำหนดค่าใดใน angular.json ที่เปิดใช้งานการเพิ่มประสิทธิภาพสำหรับ production build?
tree shaking ใน Angular คืออะไร?
+17 คำถามสัมภาษณ์
หัวข้อสัมภาษณ์ 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
พื้นฐาน NgRx
NgRx ขั้นสูง
สถาปัตยกรรม Angular
การปรับแต่งประสิทธิภาพ
ความปลอดภัยและแนวทางปฏิบัติที่ดี
รูปแบบ RxJS ขั้นสูง
Angular Universal และ SSR
Angular Micro-frontends
เชี่ยวชาญ Angular สำหรับการสัมภาษณ์ครั้งถัดไป
เข้าถึงคำถามทั้งหมด flashcards แบบทดสอบเทคนิค แบบฝึกหัด code review และตัวจำลองสัมภาษณ์
เริ่มใช้ฟรี