Ilya Gurevich, a Senior Software Engineer at The New York Times, shares insights on implementing React 18 for their news site alongside Gregor Vand, a seasoned security technologist. They discuss the challenges faced during the transition from older technologies, focusing on quality assurance in a fast-paced environment and tackling hydration mismatches. Ilya also highlights the significance of modern practices in testing and the future of web development with React 19, emphasizing teamwork and continuous learning in tech.
Read more
AI Summary
Highlights
AI Chapters
Episode notes
auto_awesome
Podcast summary created with Snipd AI
Quick takeaways
Ilya Gurevich's transition from startup environments to The New York Times highlights the importance of networking and adaptability in software engineering careers.
The upgrade to React 18 for The New York Times significantly improved website performance metrics, emphasizing the need for continuous technological modernization in legacy systems.
Deep dives
Journey to New York Times
Ilya Gurevich's career path reflects a transition from a startup environment to a prominent organization like the New York Times. He began working on touchscreens for elevators before moving to LoadSmart, where he gained pivotal hands-on experience in software engineering amidst intense challenges. His move to the New York Times was facilitated by a networking connection from a talk he gave on migrating from Angular to React. Gurevich emphasizes how his startup experience nurtured his self-motivation and problem-solving skills, which have proven invaluable in managing the complexities of a high-visibility news platform.
React 18 Upgrade Motivation
The decision to upgrade to React 18 was driven by the need for system modernization and the benefits of new features that enhance performance. Initially, the team acknowledged the upgrade was important for maintaining best practices but underestimated the significant paradigm shift React 18 represented. As they delved into the upgrade, they recognized improvements in concurrency and state management efficiency, becoming increasingly motivated by the advanced capabilities that React 18 promised for better website performance. This realization highlighted the importance of staying current with technology to optimize user experience and operational efficiency.
Challenges in the Upgrade Process
The migration to React 18 revealed significant hurdles, particularly the necessity to replace the enzyme test library, which was incompatible with the new version. The team strategically phased this transition over 18 months, migrating hundreds of test files to a new testing library to ensure functionality. As they neared completion, an unexpected challenge arose during the implementation of embedded interactive elements that led to extensive visual problems on the website, prompting a rollback to the previous state. This triggered a comprehensive review process to identify and rectify critical issues, illustrating the complex nature of upgrading established systems.
Performance Improvements and Future Directions
The upgrade to React 18 ultimately yielded substantial performance enhancements, notably in the Interaction to Next Paint (INP) metric, vital for SEO ranking. Before the upgrade, INP scores suggested poor responsiveness, averaging over a thousand milliseconds, while post-upgrade results reflected a dramatic improvement, aligning closely with preferred benchmarks. Moreover, the introduction of new methodologies and practices has positioned the organization to explore upcoming React features and optimizations, like server components and advanced hydration techniques. This journey encapsulates the ongoing challenge of balancing rapid development demands with the need for robust, scalable solutions that meet the organization's goals.
React is an open-source front-end JavaScript library maintained by Meta. It was first released in 2013 and is now the most popular web framework.
Ilya Gurevich is a Senior Software Engineer at The New York Times. Last winter, his team set out to implement React 18 for The Times’ flagship core news site. Ilya recently wrote a viral blog post about this decision, and how the team tackled some of the engineering challenges along the way.
Today he joins the podcast with Gregor Vand to talk about adopting React 18 to enhance the performance of the The New York Times website.
Gregor Vand is a security-focused technologist, and is the founder and CTO of Mailpass. Previously, Gregor was a CTO across cybersecurity, cyber insurance and general software engineering companies. He has been based in Asia Pacific for almost a decade and can be found via his profile at vand.hk.