Scribd
Upload
2 views

Frontend_Interview_Questions

The document provides a comprehensive list of frontend development interview questions and answers across various topics including HTML, CSS, JavaScript, and React.js. Key concepts covered include differences between HTML elements, accessibility improvements, responsive design techniques, JavaScript performance optimization, and React component types. Additionally, it addresses frontend performance optimization strategies and Core Web Vitals improvements.

Uploaded by

SAWERA CH
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

Frontend_Interview_Questions

The document provides a comprehensive list of frontend development interview questions and answers across various topics including HTML, CSS, JavaScript, and React.js. Key concepts covered include differences between HTML elements, accessibility improvements, responsive design techniques, JavaScript performance optimization, and React component types. Additionally, it addresses frontend performance optimization strategies and Core Web Vitals improvements.

Uploaded by

SAWERA CH
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

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.

You might also like