Skip to main content
🍞
Insights
Remix Conf 2022: The Overview

Remix Conf 2022: The Overview

So RemixConf2022 happened last month. Remix Run is on fire. This tool/framework is the key to Frontend performance with its progressive unique approach. During the conference we’ve learned a lot about Remix, from its core concepts to navigation through the state machine, forms, HTTP cache, and more, and all transparently degraded when Javascript is off!

But let’s start from the beginning.

Remix Conf 2022: The Overview

Crystallize was at the #RemixConf 2022. I arrived in Salt Lake City, on May 23rd late in the evening to be ready for my RemixConf beginning the next day as a speaker (backup speaker) and left on Thursday.

Here is my story at this event!

First Day

It really started at 4 pm with speaker registration. We got our swag! Thanks to all the sponsors, sponsors are really important in those events! 

Right after, it was followed by the speaker dinner at 4.30 pm at Caffé Molise, lucky me, Michael Jackson co-founder and CEO of Remix sat on my left a bit later for the dinner, what an honor to share that time with him, as well as with Sarah Dayan (french compatriote from Algolia), Henri Helvetica and others. I had the Scampi alla Diavola, it was great and it was so nice talking to each other that I was almost late to record my talk at 6 pm. (I am sure that talking to MJ would have been a good excuse!)

Sébastien Morel, Chief Technology Officer at Crystallize, at Remix conf 2022

6.15 pm I was on stage (first of the conference to be on stage by the way 💯) doing my talk: Remix & high-performance eCommerce.

I was a bit stressed, that was a while since I have done this and the first row was the Remix Crew including Kent C. Dodds, one of the other Remix co-founders.

BTW I am redoing that talk at a slower pace with more time to demo and answer questions in the Remix Bay Area Meetup on August 28th, 2022

Remix & High Performance eCommerce by Sébastien Morel at #RemixConf

20 minutes later, I finished my talk and a few minutes later I listened to Emily Kauffman talking about how they moved their frontend from Symfony/Twig to Remix. It was great to watch, as if you know me, you know how much I love Symfony. At Harvie, they used Remix for the Frontend and Symfony for the Backend, which is to me a great combo.

Right after was Aaron K Saunders reviewing the nested routes/layout that was interesting to see from another perspective compared to the Remix documentation.

That was it for the backup speakers, and the networking started right away! It was also when all the other speakers came to do the technical check. I discussed a bit with Emily regarding how we were handling a Service API on one domain and the frontend on another. Trick that we are using at Crystallize is to have 2 tokens, one in the cookie for the Service API (secured) and another one that is passed to the frontend but that has no permissions on the Service API.

Then I met, Daniel Weinmann from Seasoned, and he showed me their really cool open source libraries:

I will definitely check these libs out, especially for our Boilerplates with Remix, plus they are using Zod JS that I like a lot. (The creator of Zod, Colin McDonnell,  was actually at the conference it was really nice to meet him

Then it was already 9pm, I went back to my room and wrote this first part. Tomorrow that’s 17 talks to follow!

Second Day, the Conference Day

Keynote

9:11 am Michael started with a really empowering keynote. They are obsessed with the 90s, and they make the old school stuff cool again which I like a lot too. 

He explained their amazing journey, first commit was pairing with Ryan and MJ on July 9th, 2020,  they open-sourced in November 2022, and 6 months later RemixConf, 350 attendees! Such an amazing surprise for them to get that much traction. “So rad, right” would mention MJ.

Remix conf 2022 Keynote

He also talked about React Router v6 which was released pretty much at the same time (challenging for them to release both but they did).

In a few words, the Remix is:

  • Progressive enhancement
  • Performances and obsession over the Network Tab
  • Back to standard
  • Embrace the platform

Some cool things are coming like Leveraging React 18 Suspense with Remix, I cannot wait.

Finishing with a thought about trade-offs:

  • The framework that you use should give you the tools to do what you want
  • Nothing is really bad or good

Their goal at Remix is to make our job as easy as possible, keeping the stuff simple, easy, and complex things simple!

Rewatch the keynote here.

Remix trade-offs

How To WebPageTest?

Henri, the showman! whom I met the day before, talked about performance and testing.

As we were in Salt Lake City, and his talk was about metrics, Norway was there too! In the 2002 Olympic Games, Norway won the most gold medals: 13

He explained that Firebug was actually the trigger for WebPageTest, today with modern development, we need modern metrics. WebPageTest is all about that.

Check out the video

The final quote that I must mention from Henri:

You can’t improve what you don’t measure.

Instantaneously Interactive: Remix as a Browser Framework

Shaudai Person from Netflix 

First time talking in person and I wish I had done it as she did! Really, her talk was all about how Remix works. Interactivity, SSR, SSG, loading, all of it. And as a final trick, she reminded us that we can use Link Prefetch to ask Remix to prefetch!

Her talk is a must-see

State Machines On The Edge

Erik Rasmussen from Centered.

State Machines are awesome, I like to use them, I was a huge consumer of the Symfony Workflow component in my previous life.

Especially for e-commerce, State Machines make sense, for the cart, the order fulfillment pipeline, etc. We reviewed the definition and the difference between frontend state machines and backend state machines with XState and Stately (we will have  David the founder at React Norway!)

The talk is here

I have a secret plan to inject some XState state machines into our Remix Furniture Boilerplate (don’t tell anybody).

Remixing Hydrogen

Anthony Frehner from Shopify.

They are building an opinionated framework for Shopify because their API is not that simple to use. Check the talk

Deno and Remix

Ryan Dahl , the CEO at Deno and creator of Node.js.

He started by making some predictions on the fact that probably in 5,10, or maybe 20 years, HTML, CSS, and JS will still be around, and came to the conf to talk about his dream stack, and it’s not a dream anymore! Meet:

He mentioned that Remix on Deno is not really Deno first, but it’s probably coming!

Have a look at his talk here.

Deno and Remix

Remix 3D Blast

Nick Small talk was really cool, it was about rending 3D stuff in Remix using Three.js

I am actually really impatient to review the talk, but that’s probably something I will try! And our unicorn Didrik will surely have a look at it when I see what he has done on our pricing page.

The video of this talk is here.

Web Vitals: The Importance of Measuring a User Great Web Experience

Erick Tamayo from Shopify talked about Web Vitals in detail and what they are. You can find his talk here.

In case you want to dig some more on the subject of performance have a look at our documentation on frontend performance.

Making Slow Responses Seem Fast With stale-while-revalidate

Vic Vijayakumar from Eventbrite.

Vic talked about his experience on building a quick-win project with less-code, no backend and how to focus on what matter only. You can watch the video here.

Expanding Remix with Rust

Ben Wishovich

We all agree that speed and performance are keys, Ben explained how to gain even performance using Rust and Remix to save those milliseconds! Either with web assembly for the frontend or native module for node.

More here.

Full Stack Fast: Data on the Edge

Greg Brimble from Cloudflare.

Greg reminded us of the concept of “Edge”. As I like to say, it’s more than a server in the Cloud, it’s a service in the Cloud close to you.

This talk should be reviewed as well because the edge means we have decisions to take depending on our use cases regarding consistency, tolerance, and availability.

You can watch the whole talk here.

Remix Your UI & UX to Another Level

Arisa Fukuzaki from Storyblok.

Arisa shows a demo of using Remix and Storyblok in 10min “ish”. As I was watching the demo, I just imagined myself doing something similar with Crystallize the same way. Everything is as easy and much fancier with Crystallize, and that’s just my personal opinion but the UI of Crystallize is so much better ;-)

Magically Create Forms + Actions with R emix Forms

Daniel from Seasoned delivered a really nice talk (you can watch it here), and at Seasoned they are kind of the first team to build libraries on top of Remix.

Remix Forms has definitely got my attention, we will surely use this in our Remix boilerplates to greatly simplify Form management!

Incremental Remix

Jon Jensen from Netflix.

That was another really cool talk, Jon focused on how to move to Remix from a Legacy app! A lot of cool tips and tricks in his talk.

Outstanding Search Experiences with Remix and Algolia

Sarah from Algolia gave us a great example of why Remix is such a great tool using her own product Algolia.

To me, that’s really smart from Algolia to embrace Remix like that. In short, the trick is that the Agolia libraries will do the search Server Side first and the full interactivity will come after the page is rendered first, it’s sound logic, right?

Well, have a look at the talk to fully understand the problem if you don’t!

Outstanding Search Experiences with Remix and Algolia

Switching to Remix

Dennis Beatty from Neighbor told us the story of their move from a legacy app to Remix.

He’s talk if here.

Wrapping Up

I really enjoyed it!  That was my first conference in-person since January 2020 and what surprised me is how all people were really really nice!

Remix crew was awesome but every single person I met was really friendly, listening, motivated and motivating! I mean it might be a post-covid conference effect, or really the Remix community is great, I would vouch for the second option.

Wrapping up Remix cong 2022

I will definitely review some talk and try out things:

  • The 3D with Remix
  • XState
  • Remix Forms
  • We are already building an Algolia integration with Crystallize, but I will check their Remix example of course.
  • Deno is of course in my mind

Oh and yes of course! I am bringing some swag to our team in one month in Norway!

Follow the Rabbit🐰

Hands-On Experience: Remix.run eCommerce Starter

Hands-On Experience: Remix.run eCommerce Starter

Remix is getting quite some attention lately, and being in the eCommerce space, it has caught our eye.