← All topics

Svelte Senior interview questions and answers

75 questions for a Svelte (Senior) interview - with correct answers, explanations and links to the docs.

Take this quiz
  1. 1.What model does Svelte 5 reactivity use under the hood?
  2. 2.Why did Svelte 5 move from compiler-instrumented let reactivity to runes?
  3. 3.How are $derived values evaluated?
  4. 4.Why does this effect run only once, even though state.value changes?
  5. 5.What does it mean that $effect dependencies are dynamic?
  6. 6.What happens with updates batched in Svelte 5?
  7. 7.What is the cost of deep $state proxies, and how do you control it?
  8. 8.What does createSubscriber from svelte/reactivity solve?
  9. 9.What does $effect.tracking() return?
  10. 10.Why must $effect be created inside a component or another effect, and what is $effect.root for?
  11. 11.How does Svelte 5 handle events like click and input for performance?
  12. 12.Why is a {#key} block an expensive way to re-run child logic?
  13. 13.What does experimental async Svelte (5.36+) allow?
  14. 14.What are "synchronized updates" in async Svelte?
  15. 15.Do independent await expressions in markup run sequentially?
  16. 16.How do you show a loading state with async Svelte?
  17. 17.Which errors does <svelte:boundary> NOT catch?
  18. 18.What does $state.eager do in async Svelte?
  19. 19.How does Svelte render on the server?
  20. 20.Why can MediaQuery or reading localStorage at component init cause problems with SSR?
  21. 21.Why is <svelte:head> content important for SvelteKit SEO?
  22. 22.When does SvelteKit re-run a load function?
  23. 23.Why is an auth check only in +layout.server.js risky?
  24. 24.How do you trigger a reload of specific data after a mutation?
  25. 25.Why should load functions be free of side effects?
  26. 26.What does event.locals give you in SvelteKit?
  27. 27.What is handleFetch used for?
  28. 28.What does the reroute hook do?
  29. 29.What does handleError do, and why shouldn't it expose details?
  30. 30.What does the transport hook allow?
  31. 31.What are SvelteKit remote functions?
  32. 32.How do the remote function types differ?
  33. 33.What is a single-flight mutation in remote functions?
  34. 34.Why should remote function arguments be validated?
  35. 35.How does SvelteKit protect form actions from CSRF?
  36. 36.How do you prerender dynamic routes like /blog/[slug]?
  37. 37.What is the trade-off of making a SvelteKit app an SPA with a fallback page?
  38. 38.Why are form actions a good default for mutations in SvelteKit?
  39. 39.What is page.form / the form prop after an action?
  40. 40.How does use:enhance customization work?
  41. 41.Where is SvelteKit configuration declared in SvelteKit 3?
  42. 42.What replaced $app/stores in SvelteKit?
  43. 43.What happened to the $lib alias in SvelteKit 3?
  44. 44.How do you migrate a project to SvelteKit 3 or a codebase to Svelte 5 syntax?
  45. 45.How can you migrate a large Svelte 4 app to Svelte 5 gradually?
  46. 46.Where should private environment variables be read in SvelteKit 3?
  47. 47.How do you share state per request in a SvelteKit app safely?
  48. 48.Why does SvelteKit keep page components mounted when navigating between /blog/a and /blog/b?
  49. 49.Where should UI state like filters or the current tab live if it must survive reloads and be shareable?
  50. 50.What is the main performance advice for data loading in SvelteKit?
  51. 51.How can you make a code-heavy component load only when needed?
  52. 52.What should you consider when designing a Svelte component library?
  53. 53.How does scoping CSS work, and what are its limits?
  54. 54.What does <svelte:options customElement> change about styling and props?
  55. 55.Why test runes logic in files named *.svelte.test.js?
  56. 56.Which approach fits end-to-end testing of a SvelteKit app?
  57. 57.What is a good way to debug unexpected re-runs in Svelte 5?
  58. 58.What is wrong with deriving state from props like this in a reusable component?
  59. 59.How do you type a component that accepts a generic list and a row snippet?
  60. 60.What is the difference between mount and hydrate?
  61. 61.Why would you return a promise from a server load instead of awaiting everything?
  62. 62.What does updated from $app/state help with?
  63. 63.When is Svelte a particularly good fit compared to larger frameworks?
  64. 64.What does fromAction from svelte/attachments do?
  65. 65.Why is mutating data received from load in a page component a bad idea?
  66. 66.What does event delegation in Svelte 5 mean for listeners added with addEventListener on window?
  67. 67.Why can't a $derived expression change state?
  68. 68.What does $effect.pending() return in async Svelte?
  69. 69.What is a risk of using $state in a class field that is exposed as a public mutable property in a library?
  70. 70.How does Svelte handle bind:value between a parent $state and a child $bindable prop?
  71. 71.Why might a SvelteKit page with heavy +layout.server.js data hurt navigation speed?
  72. 72.What does getRequestEvent from $app/server allow?
  73. 73.Why do SvelteKit form actions return 303 redirects or fail instead of rendering errors directly?
  74. 74.How do you integrate an imperative third-party library (e.g. a chart) cleanly in Svelte 5?
  75. 75.What does a prerender remote function do?