Web Development Frameworks 3 — Questions and Answers
Question 1: What is the virtual DOM in React, and what problem does it solve?
- A server-side copy of the DOM that reduces database queries
- An in-memory representation of the UI that minimizes expensive direct DOM manipulations (Correct answer)
- A browser extension for debugging React applications
- A virtual machine that runs JavaScript faster
Correct answer: An in-memory representation of the UI that minimizes expensive direct DOM manipulations
The virtual DOM is a lightweight in-memory copy of the real DOM that React uses to batch and minimize direct DOM updates for better performance.
Question 2: In Django, what is the purpose of the `migrations` directory in an app?
- Stores database connection configuration
- Contains files that track and apply changes to database schema over time (Correct answer)
- Holds static asset migration scripts
- Manages user authentication migrations
Correct answer: Contains files that track and apply changes to database schema over time
Django migration files record schema changes so they can be applied consistently across different environments and tracked in version control.
Question 3: Which Vue.js Composition API function is equivalent to the Options API's `computed` property?
- ref()
- reactive()
- computed() (Correct answer)
- watch()
Correct answer: computed()
The computed() function in the Composition API creates a reactive reference whose value is derived from other reactive state, just like Options API computed properties.
Question 4: What is the main architectural pattern used by Angular?
- MVVM (Model-View-ViewModel)
- MVC (Model-View-Controller)
- Flux
- Component-based with MVC influences (Correct answer)
Correct answer: Component-based with MVC influences
Angular uses a component-based architecture with strong MVC influences, where components serve as controllers that connect templates (views) to services (models).
Question 5: In React, what is prop drilling and how is it typically solved?
- A performance issue fixed by useMemo; wrap expensive components
- Passing props through many intermediate components; solved with Context API or state management (Correct answer)
- A CSS-in-JS technique for drilling styles; solved with styled-components
- A webpack bundling issue; solved by code splitting
Correct answer: Passing props through many intermediate components; solved with Context API or state management
Prop drilling occurs when data must pass through many component layers; the Context API or libraries like Redux solve this by providing global state access.
Question 6: What does Rails' 'Convention over Configuration' principle mean?
- Rails generates config files automatically from code analysis
- Developers follow framework defaults to avoid boilerplate configuration (Correct answer)
- Configuration is stored in the database rather than files
- Rails uses AI to configure apps based on requirements
Correct answer: Developers follow framework defaults to avoid boilerplate configuration
Convention over Configuration means Rails assumes sensible defaults (file naming, folder structure, database columns) so developers write less explicit configuration.
Question 7: Which Next.js rendering strategy fetches data on every request and is never cached?
- Static Site Generation (SSG)
- Incremental Static Regeneration (ISR)
- Server-Side Rendering (SSR) with getServerSideProps (Correct answer)
- Client-Side Rendering (CSR)
Correct answer: Server-Side Rendering (SSR) with getServerSideProps
getServerSideProps runs on every request, making it true SSR—ideal for pages that need real-time data but unsuitable for high-traffic pages due to server load.
What is the virtual DOM in React, and what problem does it solve?