Namste React 🚀

Parcel

• Dev Build
• Local Server
• HMR - Hot Module Replacement
• File watching algorithm => written in C++
• Caching => Faster Builds
• Image Optimization
• Minification
• Bundling
• Compressing
• Consistent Hashing
• Code Splitting
• Differential Bundling - Support older browsers
• Diagnostic
• Error Handling
• HTTPS
• Tree Shaking => removed unused code
• Different dev and production bundles

Namste Food

/**

• Header
• • logo
• • Nav items
• Body
• • Search
• • Restaurant container
• • Restaurant card

• -img
  

• -Name of Res, Star rating, cuisine, delivery time etc
  

• Footer
• • Copyright
• • links
• • Address
• • Contact

*/

Two types of Export/Import

• Default Export/Import

export default component; import component from "path"

• Named Export/Import

export const component; import {component} from "path";

React Hooks

• (Normal JS Function) - Created by Facebook Developer

Most Important Hooks

• useState => It gives us Superpowerful variable in React
• useEffect

Code Splitting

⚡ Advantage of code splitting:-

(1) Improved Initial Load Time (2) Faster Time to Interactive (3) Better Performance on Low-End Devices (4) Optimized Bandwidth Usage (5) Efficient Use of Browser Cache (6) Enhanced User Experience

⚡ Disadvantage of code splitting:-

(1) Complexity (2) Increased Requests (3) Webpack and Tooling Overhead (4) Harder Debugging (5) Initial Load Time of Small Chunks (6) SEO Challenges