light mode
night mode
অ্যাঙ্গুলার (Angular)
Angular পরিচিতি Angular কি? Angular এর ইতিহাস এবং সংস্করণ (AngularJS থেকে Angular 15 পর্যন্ত) Angular এর বৈশিষ্ট্য এবং সুবিধা ডেভেলপমেন্ট এনভায়রনমেন্ট সেটআপ Angular CLI ইনস্টল করা Angular এর স্থাপত্য Angular কম্পোনেন্ট মডিউল (NgModules) টেম্পলেট এবং ভিউ ডিরেক্টিভস সার্ভিস এবং ডিপেন্ডেন্সি ইনজেকশন রাউটিং এবং নেভিগেশন Angular কম্পোনেন্টস CLI দিয়ে কম্পোনেন্ট তৈরি করা কম্পোনেন্ট ডেকোরেটর কম্পোনেন্ট লাইফসাইকেল হুকস ডাটা বাইন্ডিং (ইন্টারপোলেশন, প্রোপার্টি বাইন্ডিং, ইভেন্ট বাইন্ডিং, টু-ওয়ে বাইন্ডিং) কম্পোনেন্টের টেম্পলেট এবং স্টাইলস Angular মডিউলস রুট মডিউল (AppModule) ফিচার মডিউলস শেয়ার্ড মডিউলস ল্যাজি লোডিং মডিউলস মডিউল অর্গানাইজেশন বেস্ট প্রাকটিসেস টেম্পলেট এবং ডিরেক্টিভস টেম্পলেট সিনট্যাক্স স্ট্রাকচারাল ডিরেক্টিভস (ngIf, ngFor, ngSwitch) অ্যাট্রিবিউট ডিরেক্টিভস (ngClass, ngStyle) কাস্টম ডিরেক্টিভ তৈরি করা Angular পাইপস পাইপ কি? বিল্ট-ইন পাইপস (DatePipe, UpperCasePipe ইত্যাদি) কাস্টম পাইপ তৈরি করা অ্যাসিঙ্ক পাইপ Angular ফর্মস টেম্পলেট-ড্রিভেন ফর্মস রিয়্যাক্টিভ ফর্মস ফর্ম ভ্যালিডেশন (বিল্ট-ইন এবং কাস্টম) Form Group এবং Form Controls ফর্ম সাবমিশন হ্যান্ডলিং রাউটিং এবং নেভিগেশন রাউট সেটআপ করা Router Module এবং Route Configuration Route Parameters এবং Query Parameters চাইল্ড রাউটস Lazy Loading Routes রাউট গার্ডস (CanActivate, CanDeactivate ইত্যাদি) রাউট রেজলভার সার্ভিস এবং ডিপেন্ডেন্সি ইনজেকশন সার্ভিস তৈরি এবং ব্যবহার Injectable ডেকোরেটর হায়ারার্কিক্যাল ডিপেন্ডেন্সি ইনজেকশন সিঙ্গেলটন সার্ভিসেস Angular এর HTTP ক্লায়েন্ট HttpClientModule পরিচিতি HTTP রিকোয়েস্ট (GET, POST, PUT, DELETE) করা HTTP রিকোয়েস্টে ত্রুটি হ্যান্ডলিং Angular এর Interceptors Observables এবং RxJS ব্যবহার RxJS এবং Observables RxJS কি? Observables, Operators, এবং Subjects কমন RxJS অপারেটরস (map, filter, mergeMap ইত্যাদি) অ্যাসিঙ্ক অপারেশন হ্যান্ডলিং RxJS তে ত্রুটি হ্যান্ডলিং কম্পোনেন্ট ইন্টারঅ্যাকশন Parent-Child কম্পোনেন্ট কমিউনিকেশন (Input, Output) ViewChild এবং ContentChild সার্ভিস-ভিত্তিক কমিউনিকেশন EventEmitter ব্যবহার Angular অ্যানিমেশনস অ্যানিমেশন এর বেসিক ধারণা অ্যানিমেশন তৈরি এবং কনফিগার করা অ্যানিমেশন ট্রিগার এবং স্টেট Keyframes এবং Transitions Angular রাউট গার্ডস রাউট গার্ড কি? গার্ডের প্রকারভেদ (CanActivate, CanDeactivate, Resolve ইত্যাদি) রাউট গার্ড ইমপ্লিমেন্ট করা Lazy Loading এর সাথে গার্ড ব্যবহার Angular টেস্টিং কম্পোনেন্ট ইউনিট টেস্টিং ডিপেন্ডেন্সি ইনজেকশন সহ সার্ভিস টেস্টিং Protractor দিয়ে End-to-End টেস্টিং ডিরেক্টিভ এবং পাইপ টেস্টিং HTTP রিকোয়েস্ট মকিং Angular CLI কমন Angular CLI কমান্ডস CLI দিয়ে কম্পোনেন্ট, সার্ভিস, মডিউল তৈরি Angular CLI Workspaces Angular অ্যাপ্লিকেশন বিল্ড এবং সার্ভ করা Angular Material Angular Material পরিচিতি Angular Material সেটআপ Material কম্পোনেন্টস (Buttons, Icons, Cards ইত্যাদি) Material Data Table Angular Material থিমিং Angular Flex Layout Flex Layout দিয়ে রেসপনসিভ লেআউট Grid ভিত্তিক লেআউট তৈরি Angular Flexbox ব্যবহার Angular ফর্মস এডভান্সড ডাইনামিক ফর্মস Reactive ফর্মে FormArray কাস্টম ভ্যালিডেটর বিল্ডিং এবং ডিপ্লয়মেন্ট প্রোডাকশনের জন্য অ্যাপ্লিকেশন বিল্ড করা Angular অ্যাপ্লিকেশন অপটিমাইজেশন Ahead-of-Time (AOT) কম্পাইলেশন Backend সার্ভিসের সাথে Angular (Node.js, Spring Boot) Firebase, Netlify, GitHub Pages ইত্যাদিতে অ্যাপ্লিকেশন ডিপ্লয় Angular এর এডভান্সড টপিকস Change Detection Strategy (OnPush vs Default) Web Workers এর সাথে Angular Angular Universal দিয়ে Server-Side Rendering State Management (NgRx) Performance Optimization Techniques

Ahead-of-Time (AOT) কম্পাইলেশন

Web Development - অ্যাঙ্গুলার (Angular) - বিল্ডিং এবং ডিপ্লয়মেন্ট |

Ahead-of-Time (AOT) কম্পাইলেশন হল Angular অ্যাপ্লিকেশনে একটি গুরুত্বপূর্ণ পারফরম্যান্স অপটিমাইজেশন প্রক্রিয়া। AOT কম্পাইলেশন দ্বারা Angular অ্যাপ্লিকেশনটি রানটাইমে কম্পাইল না হয়ে আগে থেকেই কম্পাইল হয়। এর ফলে অ্যাপ্লিকেশনটি দ্রুত লোড হয়, এবং সঠিকভাবে কার্যকর হয়। Angular AOT কম্পাইলেশন শুধুমাত্র অ্যাপ্লিকেশন ডেভেলপমেন্টের সময় কম্পাইলেশন প্রক্রিয়াটিকে দ্রুত করে না, বরং এটি নিরাপত্তা এবং পারফরম্যান্স উন্নত করতেও সহায়তা করে।

AOT এবং Just-in-Time (JIT) কম্পাইলেশন এর মধ্যে পার্থক্য

Angular অ্যাপ্লিকেশন দুটি প্রধান ধরনের কম্পাইলেশন পদ্ধতি ব্যবহার করতে পারে:

  1. Just-in-Time (JIT) কম্পাইলেশন:
    • JIT কম্পাইলেশন চলাকালীন সময়ে, Angular অ্যাপ্লিকেশনটি ব্রাউজারে রান হওয়ার সময় কম্পাইল হয়।
    • এই প্রক্রিয়ায়, অ্যাপ্লিকেশনটির কম্পাইলেশন দেরিতে ঘটে, যার ফলে প্রথম লোডে কিছুটা সময় বেশি লাগে।
  2. Ahead-of-Time (AOT) কম্পাইলেশন:
    • AOT কম্পাইলেশন অ্যাপ্লিকেশনটির সমস্ত টেমপ্লেট এবং কোড কম্পাইল করে অ্যাপ্লিকেশনটি তৈরি করার আগে।
    • এতে ব্রাউজারে কম্পাইলেশন প্রক্রিয়া দ্রুত হয় এবং অ্যাপ্লিকেশনটি দ্রুত লোড হয়।

AOT কম্পাইলেশনের সুবিধাসমূহ

  1. দ্রুত লোডিং: AOT কম্পাইলেশনে কোড কম্পাইলেশন আগে থেকেই হয়ে যায়, ফলে ব্রাউজারে কম্পাইলেশনের সময় কমে যায় এবং অ্যাপ্লিকেশনটি দ্রুত লোড হয়।
  2. পারফরম্যান্স উন্নতি: কোড কম্পাইলেশন আগে থেকেই হয়ে যাওয়ার কারণে রানটাইমের সময় কম্পাইলেশন লাগে না, যা পারফরম্যান্সে উন্নতি আনে।
  3. এপ্লিকেশন সাইজ ছোট করা: AOT কম্পাইলেশন ব্যবহারে Angular শুধুমাত্র প্রয়োজনীয় কোড অন্তর্ভুক্ত করে, অতিরিক্ত বা অপ্রয়োজনীয় কোড বাদ দেয়া হয়, যার ফলে অ্যাপ্লিকেশন সাইজ ছোট হয়।
  4. নিরাপত্তা: AOT কম্পাইলেশনে টেম্পলেটগুলো সার্ভার সাইডে কম্পাইল হয়ে থাকে, ফলে XSS (Cross-Site Scripting) আক্রমণের সম্ভাবনা কমে যায়, কারণ Angular টেম্পলেটগুলোকে আগে থেকেই নিরাপদ করে ফেলে।
  5. এরর চেকিং: AOT কম্পাইলেশনের সময় কোডে ত্রুটি চিহ্নিত করা সম্ভব হয়, যা ডেভেলপমেন্ট প্রক্রিয়াকে আরও কার্যকরী এবং ত্রুটিমুক্ত করে।

AOT কম্পাইলেশন ব্যবহার করা

Angular অ্যাপ্লিকেশনটি AOT মোডে কম্পাইল করার জন্য, আপনি ng build কমান্ডে --aot ফ্ল্যাগ ব্যবহার করতে পারেন:

ng build --aot

এটি অ্যাপ্লিকেশনটি AOT মোডে কম্পাইল করবে এবং উৎপাদন পরিবেশের জন্য প্রস্তুত করবে। আপনি যদি অ্যাপ্লিকেশনটি প্রোডাকশন মোডে কম্পাইল করতে চান, তবে --prod ফ্ল্যাগও ব্যবহার করতে পারেন:

ng build --prod --aot

এই কমান্ডটি অ্যাপ্লিকেশনটিকে প্রোডাকশন মোডে কম্পাইল করবে, যা AOT ছাড়াও অন্যান্য পারফরম্যান্স অপটিমাইজেশন করবে।

AOT এবং JIT এর মধ্যে পারফরম্যান্স তুলনা

  • AOT: কোড কম্পাইলেশন আগে থেকেই হয়ে যাওয়ায় অ্যাপ্লিকেশনটি দ্রুত লোড হয়, এবং এটির শুরু হতে কম সময় নেয়।
  • JIT: কম্পাইলেশন চলাকালীন সময়ে হওয়ায় অ্যাপ্লিকেশনটি প্রথমবার লোড হতে কিছুটা ধীর হতে পারে, তবে ডেভেলপমেন্টের সময় এটি সুবিধাজনক হতে পারে।

নোট: JIT কম্পাইলেশন সাধারণত ডেভেলপমেন্ট পর্যায়ে ব্যবহৃত হয়, যেখানে দ্রুত কোড পরিবর্তন এবং টেস্টিং প্রয়োজন। প্রোডাকশন পরিবেশে AOT কম্পাইলেশন বেশি কার্যকরী।

AOT কম্পাইলেশন Angular অ্যাপ্লিকেশনগুলির পারফরম্যান্স এবং নিরাপত্তা উন্নত করতে একটি অত্যন্ত গুরুত্বপূর্ণ টুল।

Content added By
Md Azizur Rahman

Read more

Ahead-of-Time (AOT) কম্পাইলেশন

or

Don't have an account? Register

Promotion