Chapter 9. JavaScript Frameworks and Workflow

JavaScript is a major component of any modern web app. With the rise of Node.js to run JavaScript on the server and powerful frameworks like React, JavaScript is quickly becoming the primary component of any modern web app.

In 2012, the ratio of PHP to JavaScript code in version 3.6 of WordPress was about 6:7 PHP and 1:7 JavaScript. In 2018, the Gutenberg plugin that introduced the new block editor in WordPress 5.0 has those numbers reversed and then some with only 1:9 of the code in PHP versus 8:9 JavaScript. The block editor obviously is built on top of the server-side PHP, but it’s very telling that large new features in WordPress are being built primarily in JavaScript. As the block editor becomes integrated into other aspects of the WordPress dashboard, expect the amount of JavaScript in core WordPress to go up.

Why the big move to JavaScript? On the frontend side of things, rendering a website with JavaScript can be much lighter than rendering it with PHP. As you navigate around the typical website, loading all of the HTML DOM is pretty wasteful. The header, footer, menu, and other pieces of the site may not change at all. With JavaScript, you can simply load the new part of the website, change the class on the items in your menu, and voilà: new page. This is a much more app-like experience and perfect for using web apps over mobile networks where bandwidth is more scarce.

Note

Using Ajax to update pages instead of loading ...

Get Building Web Apps with WordPress, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.