Ready to optimize your JavaScript with Rust?
Webpack has been king for several years. Vercel wants folks to embrace Turbopack, but their claims about speed raised a lot of backlash after it was first announced. Lee explains why he thinks the Rust-based approach will ultimately be a big benefit to developers and how organizations who are deeply ingrained with existing tools can safely and incrementally migrate to what is, for now, a very Alpha and experimental release.
We go over the routing and rendering updates in Next.JS 13, exploring where it might offer developers more flexibility and the ability to use React server components to ship less, maybe a lot less, JavaScript. As Lee says in the episode:
“So to your point about wanting to ship less JavaScript, that was a kinda fundamental architectural decision of where we headed with the app directory. And the core of this is because it's built on React server components.
The key thing with React server components is that as your application grows in size from one component to a hundred thousand components, the amount of client-side JavaScript you send can be exactly the same. It can be constant because you can render every single component on the server.
And that's a lot different from the world of React applications today, where every new component you add for data fetching or just putting some HTML on the screen also adds additional client-side JavaScript.
So this is kind of inverting the default, back from the client to be server first. Now, of course, we still love client-side interactivity that React provides making really interactive and rich UI experiences, but the default for data fetching or just getting HTML to the browser happens from the server, and that's gonna help us reduce the amount of JavaScript.”
You can learn more about Lee on his website, LinkedIn, and Twitter. To diver deeper into his take on how Rust will impact the future of Javascript, check out a post he wrote here.
See Privacy Policy at https://art19.com/privacy and California Privacy Notice at https://art19.com/privacy#do-not-sell-my-info.
Supper Club × Lee Robinson on React Suspense, Server Components
In this supper club episode of Syntax, Wes and Scott talk with Lee Robinson from Vercel about React Suspense, server components, the edge, and more!
Lightstep Incident Response - Sponsor Streamline on-call, collaboration, incident management, and automation with a free 30-day trial of Lightstep Incident Response, built on ServiceNow. Usage-based pricing on active services promotes collaboration across your entire team to build a culture of service ownership. Listeners of Syntax will also receive a free Lightstep Incident Response T-shirt after firing an alert or incident.
Pay for the services you use, not the number of people on your team with Lightstep Incident Response, built on ServiceNow. Streamline on-call, collaboration, incident management, and automation with a free 30-day trial. Fire an alert or incident today and receive a free Lightstep Incident Response t-shirt.
Gatsby - Sponsor Today’s episode was sponsored by Gatsby, the fastest frontend for the headless web. Gatsby is the framework of choice for content-rich sites backed by a headless CMS as its GraphQL data layer makes it straightforward to source website content from anywhere. Gatsby’s opinionated, React-based framework makes the hardest parts of building a performant website simpler. Visit gatsby.dev/syntax to get your first Gatsby site up in minutes and experience the speed. ⚡️
Show Notes 00:35 Welcome
01:34 Guest introduction
LeeRob.io
Vercel
02:25 Syntax hosted on Vercel
04:08 What is suspense?
06:50 Benefits of selective hydration
13:15 Sponsor: Lightstep Incident Response
14:24 How does suspense know you’re doing something inside of it?
18:02 How does this connect to server components in React?
22:00 How do we use this in NextJS?
24:32 NextJS routing future
Layouts RFC
33:11 Will I ever be able to use web components inside NextJS?
36:12 Sponsor: Gatsby
37:14 What’s happening with the Edge?
Edge Runtime
47:37 What should we use for databases?
50:39 Supper Club dessert questions
OhMyPosh
Hyper
Warp
Svelte
Hackernews
Reddit
58:57 SIIIIICK ××× PIIIICKS ×××
××× SIIIIICK ××× PIIIICKS ××× AirPods
Shameless Plugs Careers at Vercel
Tweet us your tasty treats Scott’s Instagram
LevelUpTutorials Instagram
Wes’ Instagram
Wes’ Twitter
Wes’ Facebook
Scott’s Twitter
Make sure to include @SyntaxFM in your tweets
What even is a DevRel? (Interview)
This week Lee Robinson joins us to talk about his journey as a DevRel. We talk about what it means to be a DevRel, what orgs they fall under, how he runs his team at Vercel, Lee’s three pillars of DevRel: education, community, and product, we compare the old days of DevRel vs now, and of course what makes a DevRel a good DevRel.
Join the discussion
Changelog++ members get a bonus 3 minutes at the end of this episode and zero ads. Join today!
Sponsors:
Square – Develop on the platform that sellers trust. There is a massive opportunity for developers to support Square sellers by building apps for today’s business needs. Learn more at changelog.com/square to dive into the docs, APIs, SDKs and to create your Square Developer account — tell them Changelog sent you.
FireHydrant – The reliability platform for every developer. Incidents impact everyone, not just SREs. FireHydrant gives teams the tools to maintain service catalogs, respond to incidents, communicate through status pages, and learn with retrospectives. Small teams up to 10 people can get started for free with all FireHydrant features included. No credit card required to sign up. Learn more at firehydrant.io
Honeycomb – Guess less, know more. When production is running slow, it’s hard to know where problems originate: is it your application code, users, or the underlying systems? With Honeycomb you get a fast, unified, and clear understanding of the one thing driving your business: production. Join the swarm and try Honeycomb free today at honeycomb.io/changelog
Retool – The low-code platform for developers to build internal tools — Some of the best teams out there trust Retool…Brex, Coinbase, Plaid, Doordash, LegalGenius, Amazon, Allbirds, Peloton, and so many more – the developers at these teams trust Retool as the platform to build their internal tools. Try it free at retool.com/changelog
Featuring:
Lee Robinson – Website, GitHub, X
Adam Stacoviak – Website, GitHub, LinkedIn, Mastodon, X
Jerod Santo – Website, GitHub, LinkedIn, Mastodon, X
Show Notes:
Swyx on measuring Developer Relations
Something missing or broken? PRs welcome!
Unlocking the Developer
Proper tooling is perhaps the primary key to unlocking developer productivity. With the right tools and frameworks, developers can be productive in minutes versus having to toil over boilerplate code. And as data-hungry use cases such as AI and machine learning emerge, data tooling is becoming paramount.
This was evident at the recent MongoDB World conference in New York City where TNS Founder and Publisher Alex Williams recorded this episode of The New Stack Makers podcast featuring Peggy Rayzis, senior director of developer experience at Apollo GraphQL; Lee Robinson, vice president of developer experience at Vercel; Ian Massingham, vice president of developer relations and community at MongoDB; and Søren Bramer Schmidt, co-founder and CEO of Prisma, discussing how their companies’ offerings help unlock developer productivity.
Apollo GraphQL and Supergraphs
Apollo GraphQL unlocks developers by helping them build supergraphs, Raysiz said. A supergraph is a unified network of a company's data services and capabilities that is accessible via a consistent and discoverable place that any developer can access with a GraphQL query. GraphQL is a query language for communicating about data.
“And what's really great about the supergraph is even though it's unified, it's very modular and incrementally adoptable. So you don't have to like rewrite all of your backend system and API's,” she said. “What's really great about the Super graph is you can connect like your legacy infrastructure, like your relational databases, and connect that to a more modern stack, like MongoDB Atlas, for example, or even connected to a mainframe as we've seen with some of our customers. And it brings that together in one place that can evolve over time. And we found that it just makes developers so much more productive, helps them shave, shave months off of their development time and create experiences that were impossible before.”
[sponsor_note slug="mongodb" ][/sponsor_note]
Vercel: Strong Defaults
Meanwhile, Robinson touted the virtues of Next.js, Vercel’s popular React-based framework, which provides developers with the tools and the production defaults to make a fast web experience. The goal is to enable frontend developers to be able to move from an idea to a global application in seconds.
Robinson said he believes it’s important for a tool or framework to have good, strong defaults, but to also be extensible and available for developers to make changes such that they do not have necessarily eject fully out of the tool that they're using, but to be able to customize without having to leave the framework library tool of choice.
“If you can provide that great experience for the 90% use case by default, but still allow maybe the extra 10% power, you know, power developer who needs to modify something without having to just rewrite from scratch, you can get go pretty far,” he said.
Data Tooling
When it comes to data tooling, MongoDB is trying to help developers manipulate and work with data in a more productive and effective way, Massingham said.
One of the ways MongoDB does this is through the provision of first-party drivers, he said. The company offers 12 different programming language drivers for MongoDB, covering everything from Rust to Java, JavaScript, Python, etc.
“So, as a developer, you’re importing a library into your environment,” Massingham said. “And then rather than having to construct convoluted SQL statements -- essentially learning another language to interact with the data in your database or data store -- you're going to manipulate data idiomatically using objects or whatever other constructs that are normal within the programming language that you're using. It just makes it way simpler for developers to interact with the data that's stored in MongoDB versus interacting with data in a relational database.”
MongoDB and Prisma
Bramer Schmidt said while a truism in software engineering is that code moves fast and data moves slow, but now we are starting to see more innovation around the data tooling space.
“And Mongo is a great example of that,” he said. “Mongo is a database that is much nicer to use for developers, you can express more different data constructs, and Mongo can handle things under the hood.”
Moreover, Prisma also is innovating around the developer experience for working with data, making it easier for developers to build applications that rely on data and do that faster, Bramer Schmidt said.
“The way we do that in Prisma is we have the tooling introspect your database, it will go and assemble documents in MongoDB, and then generate a schema based on that, and then it will pull that information into your development environment, such that you can, when you write queries, you will get autocompletion, and the IDE will tell you if you're making a mistake,” he said. “You will have that confidence in your environment instead of having to look at the documentation, try to remember what fields are where or how to do things. So that is increasing the confidence of the developer enabling them to move faster.
S16:E4 - Which back-end should I use as a front-end developer ( Lee Robinson)
In this episode, we talk about good back-end options for front-end developers, with Lee Robinson, head of developer relations at Vercel. Lee talks about the major differences between frontend and backend development, how the backend has developed over time, and the array of backend options that can be easier and work well for those who mostly work in frontend development.
Show Links
Partner with Dev & CodeNewbie! (sponsor)
Vercel
Illustrator
Sketch
Figma
C++
Sass
Python
Flask
React
JavaScript
Next.Js
API
Stripe
Twilio
Auth0
SQL
Relational database
NoSQL
JSON
Airtable
Notion
Squarespace
Wix
Webflow
Zapier
PostgreSQL
Amazon Web Services (AWS)
Google Cloud
DigitalOcean
Heroku
Supabase
Hasura
Firebase
Lee Robinson
Lee is a developer, writer, and course creator. He works at Vercel as the Head of Developer Relations and frequently speaks about front-end development, design, and the future of the web.