Comparison between solito and expo-router

[ts-candide]

I'm trying to evaluate a toolchain for building a so-called 'universal' app, sharing code across web and native. I came across solito from the tamagui project, which has an example monorepo setup with solito.

I'm also aware of the expo-router project, which seems to have similar goals to solito. Furthermore, I notice that the solito monorepo examples include a setup with both solito and expo-router.

Forgive my ignorance, but I'm unsure how solito and expo-router can work together. They both seem to achieve the same goal - routing in universal apps - so why/when would I want to use them together?

[nandorojo]

i recommend going through the docs and maybe watching some of my talks on there to better understand it. solito’s main thing is that it uses next.js on web and leverages the next.js API semantics. it makes these APIs map onto native too. expo router came along later and added file system routing, powered by react navigation under the hood.

since solito uses react navigation on native, it automatically works with expo router too.

[VGerris]

Is there any clear advantage of using Solito over Expo Router ? Expo router supports separate files for web so I don't see the advantage of Nextjs so much ? I actually ran into issues with the monorepo that I found hard to resolve, maybe or maybe not related to the setup. Not meaning to undermine the importance of your project, but interested in a clear advantage for a starter.
On a side note, I am not a big fan of Expo when it comes to the breaking changes between versions, the reliance on some old libraries and in many github tickets the lack of commitment to help people that have certain issues, leading to a bunch of issues that are simply unclear and unresolved.

So if Solito is the library for uniting web and native , also without Expo router, I suppose that is a good reason to use it, especially when not using Expo router. But when using Expo, isn't going all in Expo perhaps a better way ?

[VGerris]

and just to add to this, Expo seems to be quite focussed on it being the only solution, not supporting Nextjs officially, nor any yarn above version 1, which gave me other issues in the monorepo setup.

[nandorojo]

I am definitely sympathetic to the monorepo setup being challenging. Monorepos are hard generally and there's a lot to coordinate.

I am exploring solutions to this and will hopefully find something good soon.

As for Expo Router versus Solito – it's slightly apples to oranges, though not entirely.

Solito connects Next.js with React Navigation. Since Expo Router wraps React Navigation, you can still use Solito with Expo Router. However, this is only in the case of Next.js on Web, and Expo Router on native.

Alternatively, you can go all-in on Expo Router, including both on Web and Native. I think it's a good project and it might fit your needs.

A gripe I have with Expo Router is that it uses React Navigation on Web. In my experience, while I love React Navigation, it is a native library first and I prefer to use a web-first router. I don't want any pre-build UI from a router library getting loaded into my app. I want to control all styles on Web and build it up myself. You can mostly get around this on Web with React Navigation (and thus Expo Router), by simply using Slot and going unstyled. But overall, as I bet on a framework and look to the future, I want one that is as focused on the underlying platform as possible.

This is why I made the choice for Solito to wrap Next.js at the time.

Perhaps more important in this discussion: Solito provides a strong community for people who are sharing code across web and native. While much of the conversation tends to revolve around which "framework" to use, the reality is that many of the UI patterns differ across web and native regardless of the framework.

For example, how should popovers adapt to bottom sheets on certain screens? How should scrolling work when web uses window scrolling but native needs a dedicated view? How do we handle z-index inconsistencies? What about modal routes? How do we satisfy cookie auth vs JWT? What about redirects?

To quote the Solito docs:

This library is two things:

1. A tiny wrapper around React Navigation and Next.js that lets you share navigation code across platforms.
2. A set of patterns and examples for building cross-platform apps with React Native + Next.js.

I think that 2) is important, and you could swap the "Next.js" in it to be "Web".

Prior to the release of Solito, the idea of sharing code across web and native was viewed by most as entirely unrealistic. Since its release, many new libraries have sparked up to accommodate the use case, including Expo Router, One, Gluestack, Tamagui, and many more. The ecosystem is finally agreeing with the Solito premise and offering many different approaches to buy into it. The way you choose to build your universal app is now up to you.

I didn't expect this to become so long, but the last point I'll make is this: I get the concerns and annoyance around the current Solito monorepo setup. At the time of creating Solito, this was a necessity and the best design choice I could find. But I will be working on improving it and perhaps getting rid of the monorepo requirement altogether. Your feedback is greatly appreciated on it.

[VGerris]

I agree, although I also see the advantages of a monorepo. With a system development and administration and architect background, I tend to look a lot at the software development lifecycle. I think your monorepo actually works well, but it is hard to maintain up to date. I saw for example the revert here : https://github.com/nandorojo/solito/tree/master/example-monorepos/with-expo-router and I actually had a fully working version based on Expo SDK 52 that I meant to make a PR for, but at the moment is in a non working state and I can't get my finger behind the issue currently ( index.js not found, probabybly because of some bundler config ). I have dug a lot in the libraries used and found some comments that indicate it is hard to keep up to date.

Thank you very much for sharing your ideas and knowledge ( and code :) ! ), it is greatly appreciated and I learned a lot from your videos and code. I like how you view the separation of native and web and I prefer the more modular setup and I like to have web more separate too.
Thank you for your appreciation, I am happy to share feedback and help out where I can. Is there a place where these conversations take place in general, besides discussions here ?

Because another question that came to mind now is : why Expo router :)?

I have seen the Tamagui code too, and it like you mentioned somewhere that I agree with - best to keep it simple. The basic setup at the time of trying it gave me quickly issues that were quite complicated to resolve.
In the end I think an application should be easy to develop, run, update and troubleshoot, the latter being quite the challenge in this stack in general for me and especially in the monorepo setup.
A lot depends on good documentation too, which is hard, especially with so many components involved and them constantly changing ( like API changes on all, new architecture, bundlers and the whole npm ecosystem ).

Great fun exchanging ideas and happy to have some further chat, or try out things you're working on. I think I am motivated now to give an extra shot to get the monorepo setup working again and hopefully find some time to write a good experience based article about it.
Thank you again for your work and your continued efforts to improve things, it's greatly appreciated and makes the user experience a lot better !

[nandorojo]

I agree, although I also see the advantages of a monorepo.

Likewise! And I plan to continue to use it. But hopefully it will be by choice rather than by necessity.

Thank you again for your work and your continued efforts to improve things, it's greatly appreciated and makes the user experience a lot better !

Glad it's useful, thanks for the feedback. Good luck shipping.