- Some of the features of react-router/remix are essential in building app like interfaces where the back button actually closes a modal/dialog, for example.
- framer-motion makes shared element transitions quite simple, but I'm not too sure about its runtime cost and some of the bugs I'm facing (pretty sure I'm using it incorrectly)
- While API response has been mocked, 100ms delay was added to simulate a somewhat ideal backend
- vercel provides excellent CD experience with preview links for branches & PRs.
- deployments through vercel go through in under a minute
- interactions do take quite a bit of time on an old 7xx Snapdragon phone, I notice it a lot during route transitions
- Maybe the way I use framer-motion in ScreenTransition isn't quite performant.
- Mounting and unmounting large DOM trees is surely a bottleneck. Deferred Rendering helps but ideally we'd like to wait for Concurrent Rendering from react team
- bubblewrap & PWABuilder helped in making the PWA within 1 hour
- there's a bug with PWABuilder generated apk where killing default browser (if it's not Chrome) from recent apps causes app to freeze at splash screen
- Development time for making all the widgets, pages, server, deployment etc was extremely low. Took me a sunday+monday even if I used a new-ish framework around react. I think we can get much more web devs > RN devs > Flutter devs with similar proficiency.
- Remix's dev env runs in 325ms. The feedback loop is very quick compared to an emulator.
- vercel.app is a free-tier hosting service so it may not be the best one when it comes to Time To First Byte
After having run the create-remix command and selected "Vercel" as a deployment target, you only need to import your Git repository into Vercel, and it will be deployed.
If you'd like to avoid using a Git repository, you can also deploy the directory by running Vercel CLI:
npm i -g vercel
vercelIt is generally recommended to use a Git repository, because future commits will then automatically be deployed by Vercel, through its Git Integration.
To run your Remix app locally, make sure your project's local dependencies are installed:
npm installAfterwards, start the Remix development server like so:
npm run devOpen up http://localhost:3000 and you should be ready to go!
If you're used to using the vercel dev command provided by Vercel CLI instead, you can also use that, but it's not needed.