Should I start using headless WordPress for client projects?

I mostly use WordPress for client projects and they are very happy with the solution.

Recently I visited many big projects using React and Angular and the performance is super fast. (i.e.: mobile.twitter.com)

I would like to know that should I also start providing solutions using headless WordPress or other CMS? And if yes what is the best way to do so.

Also, I would like to know the best among Angular, React and Vue, considering long time solution.

Thanks in advance :)

By headless WordPress do you mean using the Rest API? I've done it and it's awesome. You will need helper functions and some business logic, but with the right server setup and caching, you can give your CMS editors/admins the same WordPress dashboard system and ditch the entire front-end for a custom roll out.

React is my personal choice. I like all 3 to be honest but if I had to rank for my preferences I'd go with: React/Vue/Angular. React and Vue are both view layers whereas Angular gives you a lot more out of the box.

If you're looking for a long term solution, Angular might be the best bet because if you just stick to Angular and do things in an Angular way, you can lean on the framework for a lot of what you need.

With React or Vue, you'll have to figure out ajax, state management, where to put business logic, choosing the right router, and the list goes on.

That's not to mention server side rendering, which is probably your biggest hurdle. You'll need some kind of server side rendering for SEO, I think that's where you should start.

Also check out some Google searches, React vs Vue vs Angular.

Good luck!

I came across one blog which is built on React: ponyfoo.com I wondered, how they guys manage SEO thing???

They're just using cloudflare, so it's super fast:

jumpshare.com/v/vmE6WytGS3t1E3oE2YeR

Another thing about WordPress is authorization. If you are using WordPress for auth/user management then it becomes very tricky caching pages for performance.

I would break it down like this:

Static/content based, no auth > Just WordPress and as J mentioned, utilize caching and don't worry about fancy frameworks
Auth/ajax/built for speed > You can use the WordPress REST API and custom build the front end, but then have to figure out if SEO is important or not.

If SEO is important, then you need to maintain your frontend views, and also provide the base content for search engines. So If you go to site.com/post - initally you see the post content and a basic header, but when the JS kicks in you bootstrap your SPA from there.

That's the only viable way I've been able to execute a WordPress as an API app. Anything besides that, to my knowledge is a waste and you should just do something custom.

There are plenty of Node CMS' and PHP CMS' that will help solve more complicated scenarios.

If you just want faster loading, look into HTTP2, CDNs, CloudFlare, image compression, and do ALL that before considering trying to make WordPress fit into that mold.

Well the main issue with wordpress is the uncontrollable flow.

so anything where you can reduce the amount of queries, randomly fired should improve the performance .... but !! don't ignore the power of caches! you probably can use a reverse proxy system like cloudflare, to cache fixed rendered parts.

And a pre-rendered markup has the advantage of being less strain on the client as well as having a faster workable response in countries / regions with lower bandwidth.

So if you don't doing any super interactive application, I would restrain from using a fancy JS frameworks outside from so called "progressive enhancements". It's just pushes complexity onto the client with only a small amount of benefit for the user.

That's ofc only my opinion. And I love experimenting, but in retrospect to my over eager "lets try <please enter a framework>", usually it makes sense to just use small modules instead of whole views. It can be fun but you get a whole new set of problems

9 bugs in my code, fixed one, .... 99 bugs in my code

This is a great response, things to think about. Just installing Cloudflare or the "W3 Performance" plugin and a CDN for WordPress will do wonders.

People don't point out that enough that these frameworks do put a strain on the client.

As smart phones and JS engines evolve though it becomes less and less of a problem and the bottleneck is the internet speed. This is where offloading more work to the client can be the best solution.

It's so context specific though, depends on the region, demographic, site/app.

Jean-Patrick Smith thank you. Yes to some part I agree with the JS evolving, we compensate with things like glimmerjs.com to reduce parse time and so on. But still often we just get a isomorphic result and just rendering HTML is often much easier.

But we love to make our lifes complicated :D .... at least I do ;D ....

I've been working on Headless CMS project and it's really good. Using the WP REST API plus some extra endpoints that we expose with custom plugins. It's really good, highly recommend it.

But there are a few caveats:

Previewing content. In headless mode you won't have the standard WordPress flow, so you will have to make your own "preview flow" and for regular WP users it will take some time to get use to it (depending on how seamless you make it). You can have the preview button save, then open a new tab with the frontend.
Sitemaps unless your decoupled frontend follows the exact same pattern that WP you'll need to implement your own.
Shortcodes and Media Embeds wordpress translates these "on the fly" so you might need to implement them on the frontend. Depending on what they do, you might get away with just "echoing" the generated dangerously _html _or you might have to implement some sort of parsing.
Re-implement out-of-the-box WP features like the two above. There might be a lot more, depending on your case.

The bright side is, your frontend will perform and scale well, independently of WordPress. You are no longer constrained by WP. You can your frontend it do whatever you want and Content and Presentation can be managed by different development teams. You can also feed different apps with the same content.

And there are some cool things that you could do, like share content between sites thru the WP REST API.

TL;DR: It is worth it, but comes with a cost for both the content authors (new experience, things might be missing and don't work as they used to) and software developers (re-implementing features and maintaining and deploying two codebases).

We are using VueJS with Nuxt, it's wonderful. Code is maintainable, it's easy to learn, very well supported and it has advanced features out of the box.

I have another project with React and Next. Has a steeper learning curve and you need to implement advanced features on your own. Still worth a thorough read IMHO.

I am quite interested in this, how easy would it be for someone to get started with this? Do you just get your wordpress instance up, us the api's and then host your frontend and talk to it? Sorry if I am being a bit of a noob, Haven't done much wordpress stuff for a few years now and mainly do reactjs apps

Even I am new to WP headless approach. But I tried to create little demo by setting up WP instance to be consumed by Angular app. And up to now all went awesome and still it's on. Lot of learning... Soon planning to launch blog series on my personal blog :)

Thread

Should I start using headless WordPress for client projects?

Responses(4)

Recent threads

Search Hashnode

Should I start using headless WordPress for client projects?

Responses(4)

Recent threads