Is it good idea to split landing page and single page app

Question

I have app architecture issue.

I want to make landing page in something like nextjs as it will need SEO.
And I will make react app which does not need SEO and require login.

My idea is that user can be redirected from landing page to app login page.
But how this should be hosted and even is this good idea?

Should both be hosted on different domains?

Answer 1

Before we start, I do agree with you that these 2 different websites have completely different behaviors, hence demand different handling approaches.

To the point - let's break your question into the followings factors:

• Availability
• Incoming Traffic
• Pricing

Availability Most chances that your landing page should be served via a CDN in order to get world-wide coverage, while the app itslef may use a cdn. Some technical point to consider:

• If that page is also build with a modern stack it also can be hosted via a cloud-based storage
• You can select a CDN from your hosting cloud provider (such as aws, azure, gcp, etc.) or use a completely external service (such as max cdn). It mainly depends on the technological stack that your website

Incoming Traffic As landing pages are opened to the general public and using anonymous access (e.g. - no login is required) they are at a high risk level for ddos and other malicious attacks. This is why these websites are mostly hosted behind a waf, gateway or any other tier that help these websites to protect themselves from being hijacked. Also, in most use-cases, these websites should handle very high loads (way more than the app itself, which is login protected). Some key points:

• Landing page websites loads may change drastically and without any warning.. so they should be deployed in an elastic high availability manner which means - when high loads occur - please use more resources to handle these loads (and please automatically decrease them when loads return to normal levels)
• In terms of logs - incoming traffic is different when dealing with identify users and when handling anonymous access - both in terms of cyber security as well of data analysis
• Apps that require login, will mostly need to use a solid gateway and some sort of identity management solution. These parts have no benefit to the landing page in terms of functionality and also - resource usage

Pricing Yes, we want to gain as much flexibility as possible, but we also want to pay the lower price possible as well. Coupling these 2 different apps may cause using expensive resources just to handle landing page loads. On the other hand - decoupling them will allow us to track every resource group and pay only for what we are using. So yes - it's even makes sense in terms of pricing

In short (sort of) - 2 different apps should have 2 different ways of deployments - each with its own technical stack and configurations. That will give us

• Flexibility - change in one environment will not damage the other
• Deployment - 2 different pipelines - each dedicated only to the a single solution
• Pricing - there is no need to waste resources (for example: by over using libraries that consume resources that most time is unused) hence - paying less
• DevOps - in some use-cases - 2 different devOps personnel may handle each pipeline, which may be an advantage

Hope this information helps

Answer 2

Web deployment architecture is hard. The last thing you need is two versions. Choose a style out of these two and commit to it:

• Website
• Single Page App

Either of these archirectures can have a mix of authenticated and unauthenticated views.

FACTORS

• SEO
• Browser Security
• Global Performance
• User and Developer Experience

WEBSITES

These perform well in the first two areas above and pre-rendered pages can be good for SEO, when done correctly.

SPAs

These can perform well in all four areas, including the use of CDNs as ymz points out.There are techniques to improve SEO for SPAs, eg return a pre-rendered page based on bot user agents.

SECURITY

When designing your web architecture, this is likely to be the most important concern, before you can realise other benefits. Eg if you want to use secure cookies in the browser and also use a CDN, you will need to implement a tricky API driven authentication flow - see my blog post for some related content.