Frontend Developer
Web performance and tooling questions
180 questions on Web performance and tooling for frontend developers, easiest first.
Easy 53
- Inspecting an API responseeasy
- Installing a test-only packageeasy
- Native lazy loading for imageseasy
- What defer does on a scripteasy
- Good LCP targeteasy
- Good CLS scoreeasy
- Good INP targeteasy
- What TTFB measureseasy
- FCP versus LCPeasy
- Lab data versus field dataeasy
- Why CSS blocks renderingeasy
- Images that push text downeasy
- What preconnect doeseasy
- What a performance budget iseasy
- What a long task iseasy
- Testing on a slow networkeasy
- What to compresseasy
- Metric INP replacedeasy
- Why the 75th percentileeasy
- no-cache versus no-storeeasy
- What a 304 response meanseasy
- Unit of max-ageeasy
- Modern image formatseasy
- What srcset is foreasy
- Main benefit of a CDNeasy
- Best web font formateasy
- font-display: swapeasy
- HTTP/2 multiplexingeasy
- What a service worker doeseasy
- Oversized product photoeasy
- Brotli compared to gzipeasy
- What HTTP/3 changeseasy
- Reading the Network waterfalleasy
- What Vary doeseasy
- What ~2.4.1 allowseasy
- npm ci in pipelineseasy
- Committing the lockfileeasy
- What minification doeseasy
- What source maps are foreasy
- Why the Vite dev server starts fasteasy
- Loading code on demandeasy
- What tree shaking iseasy
- What npx doeseasy
- What a peer dependency iseasy
- Tool for finding leakseasy
- When to use a web workereasy
- Timing visual updateseasy
- What browserslist controlseasy
- Detached DOM nodeseasy
- What Speed Index showseasy
- Running Lighthouse in incognitoeasy
- Blurred image placeholdereasy
- Catching slowdowns in PRseasy
Medium 71
- What INP measuresmedium
- Resize handler that runs many timesmedium
- Content jumps when images loadmedium
- Slow LCP from the hero imagemedium
- Caching fingerprinted bundlesmedium
- Computing one layout shiftmedium
- What can be the LCP elementmedium
- Raising the hero image prioritymedium
- preload versus prefetchmedium
- Console warning after preloadmedium
- Default behaviour of module scriptsmedium
- Inlining critical CSSmedium
- dns-prefetch or preconnectmedium
- Computing Total Blocking Timemedium
- Parts of an interactionmedium
- Breaking up a long handlermedium
- Reading LCP in codemedium
- Collecting real-user metricsmedium
- Redirect chain hurts TTFBmedium
- Page not restored on Backmedium
- Instant next-page loadsmedium
- Skipping off-screen renderingmedium
- Heavy chat widgetmedium
- Clicks ignored after loadmedium
- Lazy loading every imagemedium
- stale-while-revalidatemedium
- Caching the HTML pagemedium
- Getting sizes rightmedium
- Origin load from hit ratiomedium
- Low CDN hit ratiomedium
- Large font for a few scriptsmedium
- When to pick font-display: optionalmedium
- Many weights of one fontmedium
- Self-hosting Google Fontsmedium
- Users stuck on old versionmedium
- New service worker waitsmedium
- Domain sharding todaymedium
- Small file, slow pagemedium
- Different crop for phonesmedium
- Changing a file at the same URLmedium
- Savings from Brotlimedium
- Encoding images on uploadmedium
- Heavy animated GIFmedium
- Three map embeds below the foldmedium
- Icon font for 20 iconsmedium
- "sideEffects": falsemedium
- Why CommonJS shakes poorlymedium
- Vendor chunk hash changesmedium
- Two copies of one librarymedium
- Finding why a package is installedmedium
- Forcing a nested versionmedium
- Does devDependencies keep code out?medium
- Leak through a closuremedium
- Timer survives the componentmedium
- Caching data per DOM elementmedium
- Removing many listeners at oncemedium
- Low-priority background workmedium
- Moment.js in the bundlemedium
- Why esbuild is fastmedium
- Polyfills nobody needsmedium
- npm audit fix --forcemedium
- Package not found in a monorepomedium
- Finding unused JavaScriptmedium
- Touch listener slows scrollingmedium
- Large CSS from a UI kitmedium
- Staying within a JS budgetmedium
- Biggest weight in Lighthousemedium
- Limiting layout workmedium
- Polling an API that rarely changesmedium
- Faster clicks on linksmedium
- Serving AVIF from one URLmedium
Hard 56
- Avoiding layout thrashinghard
- Reducing the initial bundlehard
- Janky slide-in animationhard
- Slow click handler hurts INPhard
- Layout shift when the web font loadshard
- Memory grows in a single-page apphard
- Importing one function pulls a whole libraryhard
- How CLS groups shiftshard
- Shifts after a clickhard
- Where LCP time goeshard
- Download time of a bundlehard
- Why the first 14 KB mattershard
- Finding the script behind slow INPhard
- Big DOM, slow painthard
- High TTFB only in the Gulfhard
- Marketing tags slow the pagehard
- Font preloaded twicehard
- HTTP 103 Early Hintshard
- Loading non-critical CSShard
- Good average, bad mobilehard
- LCP in a single-page apphard
- Explaining slow TTFBhard
- No Cache-Control headerhard
- User data cached at the CDNhard
- Vary: User-Agent at the CDNhard
- Choosing an image CDN setuphard
- Preloading all fontshard
- Matching the fallback fonthard
- Service worker slows navigationshard
- Large cookies on every requesthard
- Version in a query stringhard
- Using HTTP/2 Server Pushhard
- Picking the srcset candidatehard
- Invisible text on 3Ghard
- Origin outage resiliencehard
- Cache storage filling uphard
- Many edges hitting the originhard
- Same bytes, different costhard
- Slow builds from index fileshard
- What scope hoisting giveshard
- Over-splitting a bundlehard
- Deep import breaks after upgradehard
- Two instances of one packagehard
- Estimating a leakhard
- Leak from a global listenerhard
- Sending a big buffer to a workerhard
- Page views jump after prerenderinghard
- Build fails after moving to pnpmhard
- One vendor chunk for everythinghard
- Native import mapshard
- Risky install scriptshard
- Rendering a 10,000-row tablehard
- High input delay at loadhard
- Cost of a font swap shifthard
- Lab looks fine, users complainhard
- Moving tags off the main threadhard