{"version":"1.0","type":"rich","provider_name":"Acast","provider_url":"https://acast.com","height":250,"width":700,"html":"<iframe src=\"https://embed.acast.com/$/655148df2861630012a1d01b/66c3591fa294c7a66284906c?\" frameBorder=\"0\" width=\"700\" height=\"250\"></iframe>","title":"Jatin Ramanathan: How Google.com is Rendered with Wiz (Fastest UI Framework)","thumbnail_width":200,"thumbnail_height":200,"thumbnail_url":"https://open-images.acast.com/shows/655148df2861630012a1d01b/1724078317092-a06f7b15-6b29-4743-8608-09c583c5011b.jpeg?height=200","description":"<p>Links</p><p>- Codecrafters (sponsor): https://tej.as/codecrafters </p><p>- Jatin on X: https://x.com/JatinRamanathan</p><p>- Tejas on X: https://x.com/tejaskumar_</p><p><br></p><p>Summary</p><p><br></p><p>Jatin Ramanathan, a software engineer at Google, discusses the Wiz framework and its use in Google products like search, photos, and payments. Wiz is a resumable web framework that focuses on loading minimal JavaScript and uses the concept of signals for reactive programming. Signals are reactive properties that reflect the state of an observable or reactive property at any given time. </p><p><br></p><p>The Wiz framework also incorporates JS Action, a library that listens to events and delivers them to event handlers only when necessary, reducing the amount of JavaScript that needs to be loaded. The conversation also touches on the merger of Wiz and Angular and the potential for unified APIs in the future. The conversation explores the concept of responsible JavaScript and web performance. </p><p><br></p><p>We dive into the use of signals and JS action in Wiz and Angular, and how they enable declarative behavior and interactivity on the client side. The discussion also touches on the challenges of using TSX in Angular and the potential for future improvements. The importance of measuring performance and understanding the user experience on different devices is emphasized, along with the use of feature flags and instrumentation to optimize the user funnel.</p><p><br></p><p>Takeaways</p><p><br></p><p>1. Wiz is a resumable web framework used in Google products like search, photos, and payments.</p><p>2. The framework focuses on loading minimal JavaScript and uses signals for reactive programming.</p><p>3. JSAction is a library that listens to events and delivers them to event handlers only when necessary, reducing the amount of JavaScript that needs to be loaded.</p><p>4. Wiz and Angular are merging to exchange ideas and potentially unify APIs in the future. </p><p>5. Signals and JSAction in Wiz and Angular enable declarative behavior and interactivity on the client side.</p><p><br></p><p>Chapters</p><p><br></p><p>00:00 Jatin Ramanathan</p><p>03:05 Welcome Jatin</p><p>06:15 Overview of Wiz and its Use in Google Products</p><p>13:00 Resumability and the Concept of Signals</p><p>36:03 Merger of Wiz and Angular: Unifying APIs</p><p>48:08 Signals and Interactivity</p><p>50:26 Declarative Behavior with Signals and JS Action</p><p>52:10 Performance of HTML and htmx</p><p>59:10 Responsible JavaScript as a Diet</p><p>01:09:26 Open Sourcing Wiz through Angular</p><p>01:13:34 Challenges of TSX in Angular</p><p>01:16:40 Declarative Behavior Composition in TSX</p><p>01:22:15 Contributing to Wiz through Angular</p><p>01:25:11 Checklist for Responsible JavaScript and Web Performance</p>","author_name":"Tejas Kumar"}