Frontend Developer Interview Questions

A complete guide covering JavaScript Core, Asynchronous JS, React Fundamentals & Advanced, Next.js (App Router), TypeScript, Performance Optimization, and Web Security.

Total Questions:210
Difficulty Levels:
BeginnerIntermediateAdvanced
0%

Overall Progress

0/210

1.What is the difference between var, let, and const?

2.Explain closures in JavaScript with a real-world example.

3.What is the Event Loop in JavaScript?

4.What is the difference between == and ===?

5.Explain 'this' keyword and how it behaves in different contexts.

6.What is the difference between call, apply, and bind?

7.What is hoisting in JavaScript?

8.Explain prototypal inheritance.

9.What is the difference between undefined and null?

10.What are arrow functions and how do they differ from regular functions?

11.What is the difference between synchronous and asynchronous code?

12.What is the difference between deep copy and shallow copy?

13.What is the spread operator and rest parameters?

14.What is destructuring in JavaScript?

15.Explain event bubbling and event capturing.

16.What is event delegation and why is it useful?

17.What is the difference between map(), forEach(), filter(), and reduce()?

18.What are template literals?

19.What is the difference between slice() and splice()?

20.What are JavaScript promises?

21.What is the difference between Promises and async/await?

22.What is callback hell and how do you avoid it?

23.What is the difference between microtasks and macrotasks?

24.How do you handle errors in async/await?

25.What is Promise.all() and when would you use it?

26.What is the difference between Promise.all(), Promise.race(), Promise.allSettled(), and Promise.any()?

27.What are generators in JavaScript?

28.What is the fetch API and how does it work?

29.How do you cancel a fetch request?

30.What is the difference between setTimeout() and setInterval()?

31.What is React and why is it used?

32.What is JSX and how does it work?

33.What is the Virtual DOM?

34.What is the difference between props and state?

35.What are React hooks and why were they introduced?

36.What is useState and how does it work?

37.What is useEffect and what is it used for?

38.What is the difference between useEffect and useLayoutEffect?

39.What is useRef and when would you use it?

40.What is useContext and how do you use it?

41.What is useMemo and when should you use it?

42.What is useCallback and when should you use it?

43.What is useReducer and when would you use it over useState?

44.What is React reconciliation and the diffing algorithm?

45.What is the difference between controlled and uncontrolled components?

46.What are Higher-Order Components (HOCs)?

47.What is the Render Props pattern?

48.What are Compound Components?

49.What are React Portals and when would you use them?

50.What are Error Boundaries in React?

51.What is React.memo() and when should you use it?

52.What is the difference between React.memo(), useMemo(), and useCallback?

53.What is React Suspense and how does it work?

54.What are React Server Components?

55.What is React Concurrent Mode?

56.What is code splitting and lazy loading in React?

57.What is the Context API and when should you use it?

58.What is prop drilling and how do you avoid it?

59.What is the key prop and why is it important?

60.What happens when you use index as a key in lists?

61.What is React hydration in SSR?

62.What are custom hooks and how do you create them?

63.What is the useImperativeHandle hook?

64.What is the useDebugValue hook?

65.What is the useTransition hook in React 18?

66.What is the useDeferredValue hook?

67.What is the useId hook?

68.What is Automatic Batching in React 18?

69.How do you optimize React performance?

70.What causes unnecessary re-renders in React?

71.What is debouncing and how do you implement it?

72.What is throttling and how is it different from debouncing?

73.What is lazy loading and when should you use it?

74.What is code splitting and how do you implement it?

75.What is tree shaking in JavaScript?

76.What are Web Vitals (LCP, FID, CLS)?

77.How do you optimize images for web performance?

78.What is Critical CSS and how do you implement it?

79.What is the difference between preload, prefetch, and preconnect?

80.What is memoization in JavaScript?

81.What is the Intersection Observer API used for?

82.How do you implement infinite scroll?

83.What is virtual scrolling/windowing?

84.What is browser caching and how do you leverage it?

85.What is CDN and how does it improve performance?

86.What is bundle size optimization?

87.What is the difference between client-side and server-side rendering?

88.What is Progressive Web App (PWA)?

89.What are Service Workers?

90.What is the difference between Service Workers and Web Workers?

91.What is Redux and when should you use it?

92.What is the Redux Toolkit?

93.What is the difference between Redux and Context API?

94.What is Zustand and how is it different from Redux?

95.What is Recoil?

96.What is Jotai?

97.What is MobX?

98.What is the Flux pattern?

99.What is the difference between local state and global state?

100.What are Redux middleware like Redux Thunk and Redux Saga?

101.What is the difference between Redux Thunk and Redux Saga?

102.What is immer and why is it useful?

103.What is Redux persist?

104.What is React Query and when would you use it?

105.What is SWR (stale-while-revalidate)?

106.What is the difference between CSR, SSR, and SSG?

107.What is Next.js and what problems does it solve?

108.What is getStaticProps in Next.js?

109.What is getServerSideProps in Next.js?

110.What is getStaticPaths in Next.js?

111.What is Incremental Static Regeneration (ISR)?

112.What is the App Router in Next.js 13?

113.What is Remix and how is it different from Next.js?

114.What is Astro and what is Islands Architecture?

115.What is hydration mismatch in SSR?

116.What are the benefits of SSR over CSR?

117.What are the drawbacks of SSR?

118.What is Edge Runtime?

119.What is Streaming SSR?

120.What is Partial Hydration?

121.What is TypeScript and why use it?

122.What is the difference between interface and type in TypeScript?

123.What are generics in TypeScript?

124.What are utility types in TypeScript (Partial, Pick, Omit, Record)?

125.What is type inference in TypeScript?

126.What is the difference between any and unknown?

127.What is type assertion in TypeScript?

128.What are union and intersection types?

129.What is the never type in TypeScript?

130.What are conditional types in TypeScript?

131.What is mapped types in TypeScript?

132.What is the readonly modifier in TypeScript?

133.What are enums in TypeScript?

134.What is the difference between type guards and type assertions?

135.What is the keyof operator in TypeScript?

136.What is localStorage and sessionStorage?

137.What is the difference between localStorage, sessionStorage, and cookies?

138.What is the Fetch API?

139.What is the difference between XMLHttpRequest and Fetch?

140.What is CORS and how do you handle it?

141.What is the History API?

142.What is the Geolocation API?

143.What is the Notification API?

144.What is the File API?

145.What is IndexedDB?

146.What is the Cache API?

147.What is the Broadcast Channel API?

148.What is the Page Visibility API?

149.What is the Network Information API?

150.What is the Clipboard API?

151.What is WebSockets and when would you use it?

152.What is the difference between WebSockets and HTTP?

153.What are Server-Sent Events (SSE)?

154.What is WebRTC?

155.What is the Drag and Drop API?

156.What is the difference between unit testing, integration testing, and E2E testing?

157.What is Jest and how do you use it?

158.What is React Testing Library?

159.What is the difference between React Testing Library and Enzyme?

160.What is snapshot testing?

161.What is mocking in testing?

162.What is code coverage?

163.What is Test-Driven Development (TDD)?

164.What is Cypress and when would you use it?

165.What is Playwright?

166.How do you test async code in Jest?

167.How do you test React hooks?

168.What is MSW (Mock Service Worker)?

169.What is Vitest?

170.What are integration tests for APIs?

171.What is XSS (Cross-Site Scripting) and how do you prevent it?

172.What is CSRF (Cross-Site Request Forgery)?

173.What is SQL Injection and how do you prevent it?

174.What is Content Security Policy (CSP)?

175.What is HTTPS and why is it important?

176.What is the same-origin policy?

177.What are httpOnly and secure flags in cookies?

178.What is JWT and how does it work?

179.What is OAuth 2.0?

180.What is the difference between authentication and authorization?

181.What is token-based authentication?

182.What is session-based authentication?

183.How do you securely store passwords?

184.What is bcrypt?

185.What is OWASP Top 10?

186.What is Webpack and what problem does it solve?

187.What is Vite and how is it different from Webpack?

188.What is Babel and what does it do?

189.What is the difference between development and production builds?

190.What is Hot Module Replacement (HMR)?

191.What is Rollup?

192.What is esbuild?

193.What is Turbopack?

194.What is SWC?

195.What are source maps and why are they useful?

196.What is minification and uglification?

197.What is the difference between CommonJS and ES Modules?

198.What is dynamic import in JavaScript?

199.What is module federation in Webpack?

200.What is a monorepo and what tools support it (Nx, Turborepo, Lerna)?

201.What is micro-frontends architecture?

202.What is the BFF (Backend for Frontend) pattern?

203.What is GraphQL and how is it different from REST?

204.What is tRPC?

205.What is Web Components and Shadow DOM?

206.What is the Jamstack architecture?

207.What is headless CMS?

208.What is serverless architecture?

209.What is edge computing?

210.What is design systems and component libraries?