4 ms·

Don’t ever use Next. Terrible developer experience, vendor lock in, weird undocumented conventions that make building anything other than some kind of B2B SaaS

by jowday 1y ago

Don’t ever use Next. Terrible developer experience, vendor lock in, weird undocumented conventions that make building anything other than some kind of B2B SaaS CRUD site full of undocumented foot guns. My favorite thing I’ve encountered is the Next <Image /> tag somehow dropping the FPS on a webgl scene on the same page to 2 FPS.

aitchnyu 1y ago
How was Vercel able to frog-boil normal React users with vendor lock-in? React was supposed to be Meta's baby and open source was supposed to defeat vendor lock-in.
- pas 1y ago
  because they pushed shiny new features that are reaaaallly good for a certain set of commercial users (think webshops, where time to first contentful paint equals time to money) and the tech is not bad, it's just meh (immature and a bit misguided) after all by flipping the whole thing upside down, defaulting to server-side, a lot of previously hard problems became easy (the usual glueing of different APIs - user, CMS, metadata, "security", adtech, blablabla - translate to `const user = await auth();` and so on, and still after processing the request emitting a React page is kind of nice, Server Actions are also nice because Next manages the API URLs for you), and since mobile technology (phones and networks) evolved a lot it's not a problem to do a request for each page (especially on webshops where Next prefetches the ha$$y path)) but it's still a very subpar backend framework :/
  - darajava 1y ago
    Can you suggest alternatives? I've used Next and Svelte[kit] in prod and have been very unhappy with both.
    - flashblaze 1y ago
      Might not hurt to look into React Router 7 Framework mode. I've started using it in one of my side projects and loving it so far.
    - icemelt8 1y ago
      No framework, create a SPA using vite
    - pas 1y ago
      Can you name/explain your problems with them? What was the intended use case and goals, what did you like about them, and what you didn't, and what was something that was definitely missing for you?
      - darajava 1y ago
        Svelte is very immature in terms of tooling and IDE support and that hasn't seemed to improve in the last 7 years of using it. Libraries are sub-par vs React and the design of the language does not favor making things explicit. $:{} for example is not explicit, I'd much rather use a slightly longer token (like useEffect) to help document what's going on. That's just one example, it's riddled with things like that (e.g keyed foreach, store $ syntax). Also calling all files +page.svelte leads to such a messy experience in the IDE. There are other problems too I'm not thinking of. I think a lot of the draw of Svelte comes from it "feeling" very fast (both to build and to iterate on) when you first start using it, but imo using it for anything non-trivial is a nightmare. Built in scoped CSS is a great idea and compiled bundle is nice. I used it for multiple projects (order system, admin panels, etc) and it always feels that little bit more brittle when I use Svelte vs something more mature. I won't use it again for any project. I have less experience with Next and it was longer ago but iirc I found it needlessly hard to use and deploy as well as some problems with Image tags (you need the exact size of the images?). I also found their gamified tutorial really off-putting and indicative of corporate bloat which I guess makes sense now that they're locking users in. The reason I used it was for page loading speed optimization (SSR) and didn't find any better alternatives that use React at the time. I use Next for my landing page https://audiodiary.ai https://audiodiary.ai and for its admin panel.
        rich_harris 1y ago
        > $:{} for example is not explicit, I'd much rather use a slightly longer token (like useEffect) to help document what's going on FWIW you're describing a legacy syntax — modern Svelte has explicit effects, and addresses your other concerns. I think you'll find it's much more to your liking https://svelte.dev/docs/svelte/$effect https://svelte.dev/docs/svelte/$effect
- bravesoul2 1y ago
  Does Vite at least create enough competition?
- whoisyc 1y ago
  They exert immense influence over the React ecosystem, even its documentation. Example: https://react.dev/learn/creating-a-react-app https://react.dev/learn/creating-a-react-app If you are new to React and just figuring out how to get it running, you will likely end up on this page. The first recommendation is Next.js. The real best way for a beginner to start is IMO Vite. Comes with everything you need to get started and lets you choose what to do next. Curiously, the link to Vite only appears at the very bottom of the page and is implied to be only for those not already served by other options. Wink wink nudge nudge.
  - koakuma-chan 1y ago
    > They exert immense influence over the React ecosystem, even its documentation. Not necessarily, it's just (sadly) the best React framework out there. Why is no one building a better framework?
    - winstonp 1y ago
      It's called TanStack Start
      - koakuma-chan 1y ago
        No RSC support
- ryandvm 1y ago
  I never understood why Facebook was so invested in React. Why can't a 2 trillion dollar company afford to build mobile apps for two platforms?
- shoeb00m 1y ago
  Because create-react-app was awful
koonsolo 1y ago
Did you pinpoint the <Image /> issue, or are you just assuming it must be NextJs? I work with NextJs, <Image> and RTF, and never encountered such problem.
- jowday 1y ago
  The most confusing part is that it only happened really intensely on just one developer's machine. I'll admit that the way we were using the image tag was a little unusual, but still something that was imminently supported by a plain HTML image tag. My point is more that Next is such a bizarre black box that things like this were a regular occurrence. To clarify: yes, it was the next Image tag. The moment we switched to using a plain image tag it resolved itself.
toastercat 1y ago
100%. Used it last year for the first time in a long time and was surprised by how awful the experience was. Docs were vague and hard to navigate. My web application seemed slow by default. We also had a hell of a time trying to deploy it with Docker to AWS using the sample Dockerfiles provided by Vercel (not sure if this is still the case).

by jowday 1y ago

aitchnyu 1y ago

How was Vercel able to frog-boil normal React users with vendor lock-in? React was supposed to be Meta's baby and open source was supposed to defeat vendor lock-in.

pas 1y ago
because they pushed shiny new features that are reaaaallly good for a certain set of commercial users (think webshops, where time to first contentful paint equals time to money) and the tech is not bad, it's just meh (immature and a bit misguided) after all by flipping the whole thing upside down, defaulting to server-side, a lot of previously hard problems became easy (the usual glueing of different APIs - user, CMS, metadata, "security", adtech, blablabla - translate to `const user = await auth();` and so on, and still after processing the request emitting a React page is kind of nice, Server Actions are also nice because Next manages the API URLs for you), and since mobile technology (phones and networks) evolved a lot it's not a problem to do a request for each page (especially on webshops where Next prefetches the ha$$y path)) but it's still a very subpar backend framework :/
- darajava 1y ago
  Can you suggest alternatives? I've used Next and Svelte[kit] in prod and have been very unhappy with both.
  - flashblaze 1y ago
    Might not hurt to look into React Router 7 Framework mode. I've started using it in one of my side projects and loving it so far.
  - icemelt8 1y ago
    No framework, create a SPA using vite
  - pas 1y ago
    Can you name/explain your problems with them? What was the intended use case and goals, what did you like about them, and what you didn't, and what was something that was definitely missing for you?
    - darajava 1y ago
      Svelte is very immature in terms of tooling and IDE support and that hasn't seemed to improve in the last 7 years of using it. Libraries are sub-par vs React and the design of the language does not favor making things explicit. $:{} for example is not explicit, I'd much rather use a slightly longer token (like useEffect) to help document what's going on. That's just one example, it's riddled with things like that (e.g keyed foreach, store $ syntax). Also calling all files +page.svelte leads to such a messy experience in the IDE. There are other problems too I'm not thinking of. I think a lot of the draw of Svelte comes from it "feeling" very fast (both to build and to iterate on) when you first start using it, but imo using it for anything non-trivial is a nightmare. Built in scoped CSS is a great idea and compiled bundle is nice. I used it for multiple projects (order system, admin panels, etc) and it always feels that little bit more brittle when I use Svelte vs something more mature. I won't use it again for any project. I have less experience with Next and it was longer ago but iirc I found it needlessly hard to use and deploy as well as some problems with Image tags (you need the exact size of the images?). I also found their gamified tutorial really off-putting and indicative of corporate bloat which I guess makes sense now that they're locking users in. The reason I used it was for page loading speed optimization (SSR) and didn't find any better alternatives that use React at the time. I use Next for my landing page https://audiodiary.ai https://audiodiary.ai and for its admin panel.
      - rich_harris 1y ago
        > $:{} for example is not explicit, I'd much rather use a slightly longer token (like useEffect) to help document what's going on FWIW you're describing a legacy syntax — modern Svelte has explicit effects, and addresses your other concerns. I think you'll find it's much more to your liking https://svelte.dev/docs/svelte/$effect https://svelte.dev/docs/svelte/$effect
bravesoul2 1y ago
Does Vite at least create enough competition?
whoisyc 1y ago
They exert immense influence over the React ecosystem, even its documentation. Example: https://react.dev/learn/creating-a-react-app https://react.dev/learn/creating-a-react-app If you are new to React and just figuring out how to get it running, you will likely end up on this page. The first recommendation is Next.js. The real best way for a beginner to start is IMO Vite. Comes with everything you need to get started and lets you choose what to do next. Curiously, the link to Vite only appears at the very bottom of the page and is implied to be only for those not already served by other options. Wink wink nudge nudge.
- koakuma-chan 1y ago
  > They exert immense influence over the React ecosystem, even its documentation. Not necessarily, it's just (sadly) the best React framework out there. Why is no one building a better framework?
  - winstonp 1y ago
    It's called TanStack Start
    - koakuma-chan 1y ago
      No RSC support
ryandvm 1y ago
I never understood why Facebook was so invested in React. Why can't a 2 trillion dollar company afford to build mobile apps for two platforms?
shoeb00m 1y ago
Because create-react-app was awful

koonsolo 1y ago

Did you pinpoint the <Image /> issue, or are you just assuming it must be NextJs? I work with NextJs, <Image> and RTF, and never encountered such problem.

jowday 1y ago
The most confusing part is that it only happened really intensely on just one developer's machine. I'll admit that the way we were using the image tag was a little unusual, but still something that was imminently supported by a plain HTML image tag. My point is more that Next is such a bizarre black box that things like this were a regular occurrence. To clarify: yes, it was the next Image tag. The moment we switched to using a plain image tag it resolved itself.

toastercat 1y ago

100%. Used it last year for the first time in a long time and was surprised by how awful the experience was. Docs were vague and hard to navigate. My web application seemed slow by default. We also had a hell of a time trying to deploy it with Docker to AWS using the sample Dockerfiles provided by Vercel (not sure if this is still the case).