Frontend Development Interview Questions & Answers
HTML Questions
Q: What is the difference between <div>, <section>, and <article>?
A: <div>: Generic container.
<section>: Thematic grouping.
<article>: Self-contained content.
Q: How do you improve website accessibility (A11Y)?
A: Use semantic HTML, add alt attributes for images, ensure proper keyboard navigation.
Q: What is the difference between iframe, embed, and object?
A: <iframe>: Embeds another webpage.
<embed>: Embeds external content like PDFs.
<object>: Embeds multimedia.
CSS Questions
Q: What is the difference between em, rem, px, %, and vw/vh?
A: px: Absolute size.
em: Relative to parent.
rem: Relative to root.
%: Relative to parent.
vw/vh: Viewport-based.
Q: How do you create a responsive website?
A: Use flexbox and CSS grid, media queries, and relative units like %, em, rem.
JavaScript Questions
Q: How do you optimize JavaScript performance?
A: Minimize DOM manipulation, use event delegation, lazy load assets.
Q: What is a Closure in JavaScript?
A: A function that retains access to its parent's variables even after the parent function has closed.
Q: What is the difference between synchronous and asynchronous programming?
A: Synchronous: Executes line by line.
Asynchronous: Doesn't wait for execution (e.g., async/await, Promises).
React.js Questions
Q: What is the difference between Functional and Class Components?
A: Functional: Uses hooks, simpler.
Class: Uses lifecycle methods, requires 'this' keyword.
Q: What is React Virtual DOM?
A: A lightweight representation of the real DOM, improving rendering performance.
Q: What is Prop Drilling and how do you avoid it?
A: Passing props down multiple levels.
Avoid it using Context API or Redux.
Frontend Performance Optimization
Q: How do you reduce website loading time?
A: Use compression (Gzip, Brotli), minify CSS/JS, implement caching strategies.
Q: What are Core Web Vitals and how do you improve them?
A: LCP: Optimize images & lazy load.
FID: Minimize JS execution time.
CLS: Set image dimensions explicitly.