All Posts

A practical and honest look at how AI is changing frontend development, with real examples of when to use it, when not to, and how to make it work for you

30 Most important javascript questions for interview

Learn practical strategies and proven techniques to boost your productivity as a frontend developer, from workflow optimization to tool selection and mental models

Learn when and how to effectively use useMemo and useCallback hooks in React with real-world examples and best practices

Learn how to identify and fix common causes of infinite re-renders in React applications with practical examples and solutions

Master JavaScript development with these 25 essential best practices covering code organization, performance, security, and modern ES6+ features

Learn how to efficiently track element visibility and implement infinite scrolling using the Intersection Observer API

Learn how to efficiently handle forms in React using React Hook Form with practical examples and best practices

A comprehensive guide to the latest JavaScript features introduced between 2022 and 2024. Learn about top-level await, private class fields, new array methods, and more with practical examples and real-world use cases.

A simple guide to understanding the new features in React 19, including automatic batching, transitions, and the new hooks

Master asynchronous programming in JavaScript with async/await. Learn everything from basic concepts to advanced patterns, error handling, and real-world applications with practical examples.

Implement a function called parallelLimit that takes two parameters: tasks: An array of functions that return promises limit: Maximum number of tasks to run in parallel

The render tree is an internal representation of a webpage layout that is used by web browsers to determine how to display the content.

Frontend system design for auto suggest feature

Closures are a fundamental concept in JavaScript that often confuse newcomers but offer powerful capabilities to experienced developers. In essence, a closure is a function that remembers and accesses variables from its outer (enclosing) scope even after the outer function has returned.

The critical rendering path is the sequence of steps that a web browser takes to render a webpage on the screen. It includes several stages that are essential to deliver a fast and responsive user experience. The key steps in the critical rendering path are....

Server-Side Rendering, which is a technique used in web development to render a web page on the server before sending it to the client (browser).

Explain how React's Virtual DOM works and why it is more efficient than traditional DOM manipulation in terms of performance

Always use production builds for deployment, as they are optimized for performance and come with features like code minification and dead code elimination

When preparing for a frontend system design interview, it’s important to focus on architecture, scalability, performance, and user experience