All 45 questions
What are Core Web Vitals, and what do LCP, INP, and CLS measure?
Asked in 4 of 157 interviews · last asked Oct 8 · Concept · Junior
Show answer
Core Web Vitals are three metrics for loading performance, responsiveness, and visual stability. LCP (Largest Contentful Paint) measures when the largest visible image or text block appears. INP (Interaction to Next Paint) measures the delay from user interaction to the next screen update. CLS (Cumulative Layout Shift) measures unexpected layout movement.
- Good LCP is 2.5 seconds or less.
- Good INP is 200 milliseconds or less.
- Good CLS is 0.1 or less; it is a score, not a time.
- These targets are assessed at the 75th percentile of real user page visits.
What the interviewer checks: The interviewer is checking whether you can connect each metric to the user experience it measures.
Other ways it was asked
- “Could you tell me what Core Web Vitals are?”
- “What is your understanding of Core Web Vitals, and why are they important?”
- “How many Core Web Vitals are there?”
How do SSR, SSG, and CSR differ, and when would you choose each?
Asked in 3 of 157 interviews · last asked Oct 19 · Concept · Mid-level
Show answer
SSR builds HTML on the server when a request arrives; choose it for fresh or personalized pages. SSG builds HTML ahead of time; choose it for blogs or documentation that change less often. CSR renders content in the browser with JavaScript; choose it for apps such as private dashboards where search visibility matters less.
- SSR and SSG deliver content in initial HTML, helping search engines and early display.
- SSR adds server work, though caching can reduce it.
- SSG serves prebuilt pages quickly, but content changes need a rebuild or regeneration.
- SSR and SSG pages can also be interactive; rendering choices can differ between pages.
What the interviewer checks: The interviewer checks whether you can choose based on content freshness, search visibility, loading speed, and server cost.
Other ways it was asked
- “What are client-side rendering (CSR) and server-side rendering (SSR)?”
- “What is the difference between server-side rendering (SSR), static site generation (SSG), and client-side rendering (CSR)?”
- “When would you choose static, server-side, or client-side rendering, and why?”
What optimizations would you use to improve frontend performance, and why?
Asked in 3 of 157 interviews · last asked Oct 22 · Scenario · Mid-level
Show answer
I would measure performance first, then reduce downloads and browser work. I would compress images and files, split JavaScript, and remove unused code to load less data. I would lazy-load offscreen images and prioritize visible content for faster display. I would cache static files and break up long JavaScript tasks for faster repeat visits and smoother interactions.
- Use browser performance tools and real-user data to find bottlenecks and verify improvements.
- Use appropriately sized images and modern formats; avoid lazy-loading the main visible image.
- Defer noncritical scripts and reserve image dimensions to prevent layout shifts.
- Use a CDN and suitable cache headers; version static filenames so updates reach users.
What the interviewer checks: The interviewer wants practical optimizations, clear reasons, and evidence that you measure results instead of guessing.
Other ways it was asked
- “How would you improve front-end performance in a web application?”
- “How would you improve frontend performance?”
- “If you were setting up a new front-end application, what optimizations would you put in place to make it more performant? Briefly explain each one.”
How do async and defer differ, and how do they affect script loading and HTML parsing?
Asked in 2 of 157 interviews · last asked Aug 25 · Concept · Junior
Other ways it was asked
- “What is the difference between async and defer?”
- “When would you use async, and when would you use defer?”
- “What is the difference between async and defer on script tags?”
What is hydration in web applications?
Asked in 2 of 157 interviews · last asked Sep 7 · Concept · Mid-level
Other ways it was asked
- “What is hydration?”
- “What happens during hydration?”
How can you prevent parser-blocking?
Asked once · last asked May 5 · Scenario · Mid-level
Other ways it was asked
- “What is parser-blocking?”
Why is it important to keep the above-the-fold content on a webpage lightweight?
Asked once · last asked Jun 5 · Concept · Mid-level
What CSS would you use to prevent image-related layout shift in a responsive card grid while preserving the intended crop?
Asked once · last asked Jun 7 · Scenario · Mid-level
What does a browser receive when loading a website, and how does it turn that content into a rendered page?
Asked once · last asked Jun 22 · Concept · Junior
What are the best practices in Next.js for scalability and accessibility when data comes from a content management system?
Asked once · last asked Jul 16 · Concept · Mid-level
How do you approach building and optimizing high-performance UI components?
Asked once · last asked Jul 16 · Scenario · Mid-level
When you see a slow LCP on a content heavy page, what are the first three things you check to pinpoint the main cause?
Asked once · last asked Jul 16 · Scenario · Mid-level
When DevTools shows the LCP as a text element, what specific things do you check to confirm whether fonts or CSS are delaying its paint?
Asked once · last asked Jul 16 · Scenario · Senior
How do you prevent layout shift in a list when rows can gain content, such as error text, badges, or an inline editor, after the initial render?
Asked once · last asked Jul 22 · Scenario · Senior
When animating UI state changes in rows, which CSS properties do you prefer to animate to avoid layout and reflow, and how do you verify the animation stays on the compositor thread?
Asked once · last asked Jul 22 · Concept · Senior
Other ways it was asked
- “When animating UI state changes in those rows, which CSS properties do you prefer to animate to avoid layout and reflow, and how do you verify the animation stays on the compositor thread?”
In the browser event loop, where do requestAnimationFrame callbacks run relative to Promise callbacks and setTimeout callbacks, and why does this matter for UI updates?
Asked once · last asked Jul 27 · Concept · Senior
How would you build a high-performance, responsive UI for a page with a complex data grid or real-time requirements?
Asked once · last asked Jul 31 · Scenario · Senior
What is the critical rendering path, and why does it matter for page loading?
Asked once · last asked Aug 25 · Concept · Mid-level
What does a browser do after it receives an HTML document?
Asked once · last asked Aug 25 · Concept · Mid-level
When would you use async rather than defer for a script?
Asked once · last asked Aug 25 · Scenario · Mid-level
What happens in the browser after the DOM is constructed?
Asked once · last asked Aug 25 · Concept · Mid-level
What should you avoid to reduce unnecessary reflows and repaints?
Asked once · last asked Aug 25 · Concept · Mid-level
Why can animating CSS transform be more performant than animating width and height?
Asked once · last asked Aug 25 · Concept · Mid-level
Other ways it was asked
- “Why is using transform and transition more performant than changing width and height?”
Why would you choose server-side rendering for SEO, and how does it help Google crawl a website?
Asked once · last asked Sep 7 · Concept · Mid-level
How do we allow web crawlers to access our application?
Asked once · last asked Sep 7 · Scenario · Mid-level
How would you choose a rendering strategy and optimize front-end performance?
Asked once · last asked Sep 17 · Scenario · Senior
What is the difference between pagination and list virtualization in a user interface?
Asked once · last asked Sep 18 · Concept · Mid-level
Other ways it was asked
- “What is the difference between pagination and virtualization?”
How do you render a list of 10,000 items efficiently without crashing the browser?
Asked once · last asked Sep 19 · Scenario · Senior
How do you optimize product images before uploading them to keep the store running fast?
Asked once · last asked Sep 20 · Tooling
Other ways it was asked
- “How does optimizing product images affect a Shopify store's loading speed?”
If a product listing contains up to 10 images, will that slow down the website?
Asked once · last asked Sep 20 · Scenario
Can you explain LCP? If an application has LCP issues, how would you fix them?
Asked once · last asked Oct 7 · Scenario · Senior
Can you explain Largest Contentful Paint (LCP) in depth?
Asked once · last asked Oct 7 · Concept · Senior
Other ways it was asked
- “Can you explain LCP in depth?”
Explain how hashing, CDNs, and the browser rendering pipeline affect page loading.
Asked once · last asked Oct 7 · Concept · Mid-level
Other ways it was asked
- “Explain how caching, CDNs, and the browser rendering pipeline affect page loading.”
What are repaint and reflow in the critical rendering path?
Asked once · last asked Oct 8 · Concept · Mid-level
How would you improve the LCP of a 2–3 MB banner image at the top of a product listing page?
Asked once · last asked Oct 8 · Scenario · Senior
Beyond reducing image size and using a CDN, what techniques would you use to improve the LCP of a large banner image?
Asked once · last asked Oct 8 · Scenario · Senior
How would you ensure the browser prioritizes the LCP image over other resources on a static page?
Asked once · last asked Oct 8 · Scenario · Senior
How would you prevent an infinite scroll feed from growing too large and slowing down the application?
Asked once · last asked Oct 12 · Scenario · Senior
What is server-side rendering, and what other rendering approaches can you use in front-end applications?
Asked once · last asked Oct 23 · Concept · Mid-level
Why would you use server-side rendering?
Asked once · last asked Sep 7 · Concept · Junior
What is Lighthouse used for?
Asked once · last asked Mar 21 · Concept · Junior
What is hydration in web development?
Asked once · last asked Jun 4 · Concept · Mid-level
When you're building an animation-heavy page, how do you decide which elements should animate and which should stay static?
Asked once · last asked Jul 22 · Scenario · Senior
What is rendering in web development?
Asked once · last asked Sep 9 · Concept · Junior
What is repainting?
Asked once · last asked Oct 8 · Concept · Junior
More HTML and CSS interview questions
- All HTML and CSS interview questions
- HTML Basics and Semantic HTML Interview Questions
- CSS Layout and Responsive Design Interview Questions
How this list is made
Every question here was asked by a real interviewer in a real job interview that a candidate ran MeetAssist in. After the call, the interviewer's questions are pulled from the transcript. Practice sessions, tests, exams and anything that was not a job interview are dropped.
Questions are rewritten so they make sense on their own: names of people, employers and clients are removed, and speech-to-text mistakes are fixed. Small talk, logistics and questions about one candidate's own résumé are left out. Rephrasings of the same question are merged, and the count is the number of different interviews it came up in.
The interviews come from candidates who use MeetAssist, so they lean towards software, data and AI roles: the shares describe these interviews, not every HTML and CSS interview. Answers to the most asked questions are written and checked by an editor; a "common mistake" is shown only when reviews of real answers in these interviews show it, with the count.
157 interviews, 125 candidates, Oct 2025 to Oct 2026. Updated every month with new interviews.
Or add the Chrome extension