Paths/Frontend Engineer/Performance & Accessibility / Core Web Vitals
Keep the Bundle Small
The fastest byte is the one you never ship. Write the size budget and the rule that splits the code you do not need on first paint.
Validator
⏱ 0:00
IDLE — checks run live as you type commands; submit when done
01Requirements
live checks- File ~/frontend/perf/bundle.json exists○
- The config states the maximum size per entry point○
- The config states how the code is split and lazy loaded○
02Walkthrough
1 of 3 revealed- 01
Write the size budget
Set the limit per entry point, and make the CI job fail when it is exceeded.
echo '{"entry": {"main": {"maxSizeKb": 180}, "admin": {"maxSizeKb": 320}}}' > ~/frontend/perf/bundle.json - 2 locked · each failed submit reveals one
03Stuck?
0 of 3 revealedTake a hint without losing the lab — each one points at the thing to look at, not at the answer.
04AI Tutor
guides, never solvesTell me what you're stuck on — I'll nudge, not solve. Which requirement are you looking at?
04Notebook
saved locally in this browserlearner@lab — ubuntu:24.04
Session is disposable
↑/↓ recalls commands · Ctrl+Enter submits · type help for the command list