View Transitions: The brand-new browser API that will blow your mind

View Transitions: The brand-new browser API that will blow your mind

🎙 Jakob Endrestad Kielland 👥 227K 📅 November 6, 2025 ⏱ 10 min 👁 10K 📄 tutorial 🧭 2026-08-13
Available in: English (current) Français

Keywords

View TransitionsCSSJavaScriptSPAMPA

Summary

In this lightning talk from NDC Copenhagen, Jakob Endrestad Kielland introduces the View Transitions API, a new browser API that enables smooth transitions between different views on the web. He begins by contrasting the smoothness of native apps with the typical web experience, attributing the difference to transitions. He explains that historically, web developers had to rely on JavaScript libraries like Swup, which had limitations, especially for multi-page applications. The View Transitions API solves this by allowing transitions between both single-page and multi-page applications with minimal code. The talk covers the anatomy of a view transition, including the pseudo-element tree, view transition names, and the default root transition. He demonstrates how to trigger transitions in SPAs using the startViewTransition function and in MPAs with a simple CSS snippet. He shows how to customize animations using CSS, create multiple view transition groups, and leverage automatic position and size animations. The talk concludes with a complex demo built with pure HTML and CSS, showcasing the API’s power. The speaker emphasizes the API’s ease of use and encourages developers to explore it, while cautioning against overuse.

183 words

Critical Evaluation

Value of the Information & Strength of the Argument

The talk provides valuable, practical information about a new browser API. The speaker demonstrates the API with live demos, making the concepts tangible. The argumentation is clear and logical, building from the problem to the solution and then to advanced features. The speaker acknowledges limitations and trade-offs, such as the need for custom animations and the potential for misuse. The demos are effective in illustrating the API’s capabilities, and the speaker’s enthusiasm is contagious. The talk is well-structured and accessible to developers with a basic understanding of web technologies.

Scientific Rigor, Source Quality, Title Accuracy

The talk is scientifically rigorous in its technical accuracy. The speaker correctly describes the API’s behavior and browser support. He does not cite external sources, but the information is based on his own experience and the official API documentation. The title accurately reflects the content, as the API is indeed brand-new and has the potential to be mind-blowing. The talk does not include any advertising or sponsored content. The speaker’s credentials as a consultant and developer add to the credibility. The talk is a tutorial, not a research presentation, so the lack of citations is appropriate.

200 words

Title / Content Match

The title accurately reflects the content, which introduces the View Transitions API and demonstrates its capabilities.

Quality & Reliability

8/10

The talk is a technical tutorial by a practitioner, demonstrating the View Transitions API with live demos. The content is accurate and up-to-date as of late 2025, with good browser support mentioned. The speaker provides clear explanations and practical examples, though it is not a peer-reviewed source.

Key Moments

Cited Sources

  • NDC Conferences — Conference organizer
  • NDC Copenhagen — Event page for the conference where the talk was recorded

Concurring Sources

  • MDN Web Docs - View Transitions API — Official documentation confirming the API's features and usage.
  • CSS View Transitions Module Level 1 - W3C — Specification of the API, confirming the described behavior.

External References

Contribution & Novelties

This talk provides a clear and concise introduction to the View Transitions API, which is a relatively new addition to web standards. It offers practical examples and demonstrates the API’s potential to simplify complex animations that previously required JavaScript libraries. The speaker’s emphasis on using pure HTML and CSS for a multi-page application is particularly innovative, showing that the API can work without any JavaScript. The talk also highlights the automatic handling of position and size changes, which is a powerful feature for creating smooth user experiences.

Pour aller plus loin :

  • View Transitions API - MDN Web Docs — Official documentation and examples.
  • CSS View Transitions Module Level 1 - W3C — Specification of the API.
  • View Transitions API - web.dev — Google’s article with detailed explanations and demos.

130 words

Radar Profile

The radar chart shows a balanced profile with high scores in information quality, technical level, and reliability, while the quantity of information is slightly lower due to the short duration. This indicates a focused and well-delivered technical talk.

Reliability 8/10

💬 No comments were provided for analysis.