
React Performance-optimalisatie
React.memo, useMemo, useCallback, lazy loading, code splitting, React DevTools Profiler
1Wat is de primaire rol van React.memo?
Wat is de primaire rol van React.memo?
Antwoord
React.memo is een Higher-Order Component dat de render-output van een component memoiseerd. Het voert een oppervlakkige vergelijking van props uit en slaat re-rendering over als de props niet zijn gewijzigd. Bijzonder nuttig voor het optimaliseren van dure child components die vaak dezelfde props ontvangen.
2Wat is het belangrijkste verschil tussen useMemo en useCallback?
Wat is het belangrijkste verschil tussen useMemo en useCallback?
Antwoord
useMemo memoiseerd het resultaat van een functie (de geretourneerde waarde), terwijl useCallback de functie zelf memoiseerd. useMemo wordt gebruikt om dure berekeningen te optimaliseren, terwijl useCallback wordt gebruikt om functiereferenties die als props worden doorgegeven te stabiliseren, waardoor onnodige re-renders van gememoïseerde child components worden voorkomen.
3In welk geval kan het gebruik van React.memo contraproductief zijn?
In welk geval kan het gebruik van React.memo contraproductief zijn?
Antwoord
React.memo kan contraproductief zijn bij components die bij elke render andere props ontvangen, omdat de kosten van de oppervlakkige props-vergelijking worden toegevoegd zonder voordeel (het component wordt toch opnieuw gerenderd). Het is beter om React.memo te reserveren voor components die vaak dezelfde props ontvangen en dure renders hebben.
Waarom useCallback gebruiken voor een functie die als prop wordt doorgegeven aan een component die met React.memo is gememoïseerd?
Wat is het belangrijkste voordeel van code splitting met React.lazy?
+19 gespreksvragen
Andere React / Next.js-sollicitatieonderwerpen
JavaScript-basisbegrippen
React-basisbegrippen
React Hooks
Componentlevenscyclus
React Router
Statusbeheer met Context
Formulieren & Controlled Components
Gegevens ophalen & API
React Query (TanStack Query)
Styling & CSS-in-JS
Next.js Fundamentals
TypeScript met React
Next.js Data Fetching
Next.js Server Actions
Routing & Navigatie in Next.js
Next.js API Routes
Next.js Metadata & SEO
Next.js Middleware & Auth
React Testen
Zustand State Management
Error Boundaries & Error Handling
Advanced React Patterns
Geavanceerde Next.js-functies
Next.js Deployment & Productie
Architecture & Design Patterns
React Server Components
Next.js Internationalisering
React Beveiliging & Best Practices
Beheers React / Next.js voor je volgende gesprek
Krijg toegang tot alle vragen, flashcards, technische tests, code review-oefeningen en gespreksimulatoren.
Begin gratis