Git Product home page Git Product logo

Comments (4)

frandiox avatar frandiox commented on May 27, 2024

Thanks for the suggestions.

there could be vite-ssr preview that runs a local web server.

While this is possible, a production server normally needs more logic than just running vite-ssr. In a typical setup, your production server will also run Express/Koa/Fastify/etc to serve your API (which can be consumed by the rendering app). This logic is completely custom and is not something that a generic local server in vite-ssr can handle.

Apart from that, vite-ssr is unopiniated about your production setup, meaning you can run in Express.js, in a serverless platform like Vercel/Netlify, or even in a Cloudflare Worker. All of them have enough differences that makes it hard to create a "preview" local server that fits most people (CF Workers are not even Node.js).

renderHtml (so that the end user doesn't need to deal with importing from dist folder, suppress type warnings, etc.)

Unless I'm missing something, doing import renderHtml from 'vite-ssr/server' would need to assume there is a build step for the production server (so we can map the import to your local dist folder and bundle it), which might not be true for some setups. That's why right now you need to import manually the built files, to make it agnostic from the platform/setup you use in production.

I agree it's not the best experience, though, and I would like to hear alternatives that improve DX but keep this library agnostic enough to be used anywhere.
For example, there's also Vitedge, which is more opinionated and takes over the build step for the server (Cloudflare Worker in this case). Therefore, it can provide easy syntax like import xxx from 'vitedge/worker' because it controls how things are bundled in production.

createApp or something along the lines, an Express/Connect app that doesn't listen by itself but could be injected into own http server

I guess this is already answered but just to be more explicit, this might not work with every setup/platform such as Vercel (serverless functions that don't need Express.js).

I'll keep it in mind, though, and see if there's anything that can be done to improve this part πŸ‘

from vite-ssr.

IlyaSemenov avatar IlyaSemenov commented on May 27, 2024

While this is possible, a production server normally needs more logic than just running vite-ssr. In a typical setup, your production server will also run Express/Koa/Fastify/etc to serve your API (which can be consumed by the rendering app).

Not really. You're explaining the behemoth approach, which has been long discouraged. In a typical modern setup, each HTTP service does solely its own job. One doesn't mix SSR and API server in the same process, this is an anti-pattern. So running a dedicated SSR server is a typical setup in a proper modern architecture.

If several HTTP services are to live under the same domain name (in production), one uses wrapping HTTP routers such as Kubernetes ingress rules, or - in simpler setups - nginx running in sidecar (or even the same) container.

For someone who still wants a behemoth HTTP server doing everything, I suggested lower-level createApp API (an Express app that could be used along with Express/Koa/etc. API server).

Now then, for someone who doesn't even need a HTTP server (such as certain serverless environments), you would expose renderHtml.

Unless I'm missing something, doing import renderHtml from 'vite-ssr/server' would need to assume there is a build step for the production server (so we can map the import to your local dist folder and bundle it), which might not be true for some setups.

Why would it need a build step? It might have one but it may live happily without it.

It could dynamically require from process.cwd() + "/dist" and/or use user-provided path with something like const renderHtml = createHtmlRenderer({ dist: path.resolve(__dirname, "dist") }.


I 100% agree about being un-opinionated. However, that doesn't mean you can't expose typical reusable functions and/or runnable scripts. I don't see anything opinionated in my suggestions above, it's simply about reducing copy/paste between projects and covering the low-level logic of working with manifests.

from vite-ssr.

kadiryazici avatar kadiryazici commented on May 27, 2024

We can have vite-ssr preview script like how vite preview does. It could create a custom server with http module in nodejs.

from vite-ssr.

frandiox avatar frandiox commented on May 27, 2024

@kadiryazici Yeah, I'm adding preview to Vitedge, which wraps this package, so I will probably implement it here as well. While I'm at that, I will probably make that logic public so anyone can import it in a production Node server.

from vite-ssr.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.