info/relaks-wordpress-example
1
0
Fork 0
mirror of https://github.com/trambarhq/relaks-wordpress-example.git synced 2025-09-02 12:42:38 +02:00
Code Issues Releases Wiki Activity

Merge branch 'master' into live-demo

Browse Source
This commit is contained in:
Chung Leong
2019-02-12 20:32:22 +01:00
parent fbb05c1a3e 8b7c6273d8
commit 4cd4fcd8cc
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@@ -1,8 +1,8 @@
Zero-latency WordPress Front-end
================================
In this example, we're going to build a Zero-latency front-end for WordPress. When a visitor clicks on a link, a story will instantly appear. No hourglass. No spinner. No blank page. We'll accomplish this by aggressively prefetching data in our client-side code. At the same time, we're going to employ server-side rendering (SSR) to minimize time to first impression. The page should appear within a fraction of a second after the visitor enters the URL.
In this example, we're going to build a zero-latency front-end for WordPress. When a visitor clicks on a link, a story will instantly appear. No hourglass. No spinner. No blank page. We'll accomplish this by aggressively prefetching data in our client-side code. At the same time, we're going to employ server-side rendering (SSR) to minimize time to first impression. The page should appear within a fraction of a second after the visitor enters the URL.
Combined with aggressive back-end caching, what we'll end up with a web site that feels very fast and is cheap to host.
Combined with aggressive back-end caching, we'll end up with a web site that feels very fast and is cheap to host.
This is a complex example with many moving parts. It's definitely not for beginners. You should already be familiar with technologies involved: [React](https://reactjs.org/), [Nginx caching](https://www.nginx.com/blog/nginx-caching-guide/), and of course [WordPress](https://wordpress.org/) itself.
@@ -94,6 +94,8 @@ Now return to the WordPress admin page and publish another test post. After 30 s
To see the code running in debug mode, run `npm run watch`. The client-side code will be rebuilt whenever changes occurs.
To populate your test site with dummy data, install the [FakerPress plugin](https://wordpress.org/plugins/fakerpress/).
To shut down the test server, run `npm run stop-server`. To remove Docker volumes used by the example, run `npm run remove-server`.
If you have a production web site running WordPress, you can see how its contents look in the example front-end (provided that the REST interface is exposed and permalinks are enabled). Open `docker-compose-remote.yml` and change the environment variable `WORDPRESS_HOST` to the address of the site. Then run `npm run start-server-remote`.