There is new and old technology you probably don't know about. But the question still stands...
Well, it depends. You don't know it, but you really only have 3 options.
- Amazon Web Services
- Google Cloud Platform
- Microsoft Azure
- Some very very small options including IBM
Amazon holds the majority, at around 40% of the market share of all websites on the internet. This includes the top hosting providers:
I don't know anyone who uses Azure or IBM, but they have a small, but non-negligible part of the market share.
Amazon has a terrible monopoly, hence why it IS such a big deal that it kicked off Parler, Twitter's direct competitor, from their servers for no proven reasons. That, however, is for another post.
Today, I am going to focus on the servers listed above and their respected technologies.
- Client Side Rendering (CSR) - html generated dynamically in the client's browser
- Server Side Rendering (SSR) - html generated dynamically from the server
- Static Site Generation (SSG) - pre-generated static html
- Hybrids using SSG, SSR, and CSR
- Incremental Static Regeneration (ISR) - NextJS method which generates static pages, then re-loads the page on the client after a certain time in the case where the dynamic data has been changed
- Automatic Static Optimization - NextJS feature that automatically determines which pages to generate statically, and which to generate dynamically
- SSR Streaming - Currently in Alpha version of React 18, allows you to render lazy-loaded components using promise based concurrency and await under the hood (startTransition, Suspence)
- Puppeteer - Uses a second server with Headless Chrome (a server-side browser) to display server-side only for bots... Rendertron is an example
If you deploy your app, you want to deploy it quickly. Running a full time scalable server can get expensive. Then, came the invention of serverless functions. You are pretty much going to be running an AWS Lambda or a Cloud Run Container. What you don't know is how powerful these things really are. If you have the money, you can make them so freaking quick. They are not really functions, but microservices that can do anything. Other providers can just make them cheaper, but with limited functionality.
Vercel, for example, builds their own, but has a 50MB limit. Netlify has a 10s limit. They are made for certain things.
NextJS has created a new way of thinking, or a new type of hybrid. If you deploy a NextJS app to Vercel, every single page runs on its own serverless function. This is important if you have a large React App. I suspect SvelteKit will follow in these footsteps now that Rich Harris (creator of Svelte) is on board with Vercel.
While this means the future of the internet is looking more like React and Svelte only, I am always onboard with innovation. However, I don't know that a React Serverless Function for every page is always, or even most of the time, the best option. It still needs to spin up every page, as small and quick as they may be.
Google and Amazon have an edge (hehe). It is the extremely quick network of servers that connect to ISPs around the world. When you put your serverless functions on the edge, which you can do in Google or any of Amazon's hosting children (Vercel, Netlify, etc), not only will their functions spin up quickly, but the information will get transmitted to your clients as quickly as possible.
Your static data can get cached on CDNs around the world, also delivering the information as quickly as possible.
Most of these server platforms provide a CDN for free for your static data, but charge for the edge computing. Google, for example, requires some configuring and starts around $20 a month. Vercel adds this out-of-the-box on their first payment plans.
This is going to be Vercel's second best innovation, not be confused with serverless functions or the edge network (Vercel's edge computing network).
Basically Vercel allows you to run micro-computing on their Edge Network. However, it never spins up. It is not made to host even a full page of an app, so it is a cheap tool for Vercel. It is limited to only 1MB and must return a response in 1.5 seconds...
This is kind of genius, but not practical in all cases. Again, you're currently limited to NextJS, so React.
The Rendertron idea never seemed to have taken off. I personally have emailed Vercel and Netlify trying to explain to them how it could benefit them if they implemented this. I really don't think they understand how it works. It is not all on one server, so it is not slow.
Basically you have two server instances. Your Rendertron server could be on a cold-start serverless function. It can only be run with a secret key, and returns the html of the website you send it. Your app server would be separate, and very very small. All it needs is a bot checker and a fetch command. When a user requests a page on your site, your app server just sends it to the html page with CSR only. If it is a bot, your app server directs to your Rendertron serverless function server with your secret key, and sends back the appropriate html for the BOT and SEO.
The large puppeteer package ONLY gets loaded for Bots.
So I had an idea for these hosting platforms. What if they had a Rendertron server on their edge network that is always running. This theoretical hosting platform would only support CSR and SSG sites, however, the SEO would be automatically generated for every site they host. The user could only change certain rewrite rules.
Either way, my idea would definitely be useful for many people who care about the generated part of SEO only.
What are your thoughts?
Maybe. I built a few Apps in SvelteKit, but it is still a baby. The Material UI kits are funky or non-updated, and other UI Frameworks don't even work currently with SSR. The development time is so quick as you master SveltKit in a week.
I think I hate React due to Facebook (your billionaire creepy uncle who keeps telling you to hush), Hooks, and the overly stuffed
create-react-app with modules that aren't even maintained, or maintained by different people. However, the majority of you disagree with me (or agree but still use it for work purposes).
You can't argue Edge Functions are freaking cool. I am not a fan of Vercel's Serverless Functions for every page, but their File System Api will eventually work on any Framework that supports it.
The ISR and Streaming functions of NextJS could technically be manually configured in other frameworks, but it would not quite work as NextJS is working to optimize it.
But SvelteKit will probably have all this functionality soon as well in 2022.
I freaking love Angular. You can't go wrong with Angular Univeral on Cloud Run with Cloud Build and Google Cloud CDN. They now have the Edge Computing Network ready to go as well.
Sure, SvelteKit is smaller, faster, and easier to learn than all Frameworks, but it is NOT a trusted enterprise-ready Framework. If you need complex data, it is simply not ready yet. If you are building your personal blog, this is 100% the way to go.
I do not have much experience with Vue. From what I can see it is trying to take the best parts of React and Angular and put them together. It is enterprise ready from my limited experience.
React has options. Many options. Too many options? It has been pasted in so many different ways.
Build with what you know. I think too many people focus on micro seconds of loading time, when they should be focusing on development time. The user doesn't care how you built it, only that it works, and works quick enough.
But these are just my opinions and observations...
Any other technologies I am missing?