Why More of WordPress UI is written in JavaScript not PHP
With the announcement of Calypso, a JavaScript based UI in November of 2015 and then the launch of the Gutenberg project in 2016 using React.js, WordPress Head Honcho Matt Mullenweg tripped off a lot of conjectures as to why the departures from WordPress’ primary development language, PHP. Now consider that PHP has just moved to version 7.0 with notable speed improvements and code streamlining. This makes the WP transition to JavaScript for core portions of the WP code base even more intriguing. This review will consider reasons for a switch from PHP primarily to more JavaScript in the WordPress Codebase..
For the past ten years, functional features, reliability, ease of use and good design have won top spot for websites on the Web. Lurking in the background has been speed of operation. But in 2010 Google made it official and speed was added to the ranking of websites. This was followed in 2015 with the ranking of websites now including responsive websites and then in 2017 higher rankings for websites that are SSL encrypted. Google’s test of web performance includes several measures on these factors.
But websites owners have not had to wait for Google’s pronouncements, they have discovered in the marketplace that mobile-ready responsiveness and speed are vital to their success on the Web.
- page load time > 5 seconds leads to page abandonment and 46% never returns more
- for each 100ms speed improvement, Amazon sees 1% increase in revenues more
- 1/3rd of all Xmas purchases were made on a mobile phone more
- Shopzilla load-speed improvement from 6 to 1.22 sec shows 12% better sales more
- 78% of local searches on mobile phones resulted in a purchase more
- a 2.2 second drop in load time resulted 60Million more Firefox downloads more
- 48% of mobile users reject websites that don’t provide effective mobile UI more
Searchmetrics, which ranks many measures of website’s effectiveness each year, sees the following order of importance for 2017:
1) Content is still king with readability, design and keyword use the critical factors;
2) User experience with responsive design and use of images the next key factors;
3) Site speed dominates the technical criteria;
4) Backlinks with referring domains still ranks as an important factor in site success
5) Social media connections is the fifth, “bonus” factor.
So the inevitable question is how does JavaScript contribute more to WordPress on these measure of success than PHP?
Where JavaScript Leads PHP
On the content side JavaScript is used extensively to enhance layouts and add interactive components like tabs, popups, accordions, sliders and other dynamic widgets that PHP-alone is hard pressed to deliver. But keyword use and readability are largely up to the website designers/operators. However, JavaScript, with its vast collection of thousands of plugins and libraries, now has a calling card as effective as WordPress – “there is a plugin for that” whenever users need to create new content or components for their Web apps [see here].
Responsive design is primarily driven by CSS media queries so JavaScript and PHP are equivalent except in one respect. Through the use of DOM and style savvy scripts written in jQuery, Reactjs and other JavaScript plugins, it is possible to make interactive responsive design changes not possible in PHP. Again this client side need plays to a JavaScript strength.
This JavaScript advantage is even stronger in the case of image use. Even with the PHP use of HTML5 and CSS3, image manipulation and display online [especially for animations, effects, gallery grids and layering] is largely empowered by JavaScript in WordPress now. Likewise for Canvas, SVG, 3D manipulations and gaming, the Web is becoming largely a JavaScript + specialized libraries driven world. This reflects the client side advantage that JavaScript has over PHP.
JavaScript Speed Is King
In benchmarks between the latest versions of JavaScript [Chrome V8] and PHP [PHP 7.00] summarized here, JavaScript consistently outperforms PHP in most tests using identically the same hardware and operating system software. PHP generally delivers smaller runtime memory usage while JavaScript has more loadtime scripts that are smaller in size.
But even of bigger impact, is the fact that JavaScript has several JIT compilers that can produce native opcodes for iOS, Android, Windows, Linux and/or Mac apps from Google, Mozilla and others. In the case of absolute speed requirements, there are JavaScript to Java and JavaScript to compiled native code production systems. These JIT and native code compilers are just appearing on delivery horizon for PHP.
Even on the server side, JavaScript Node.js servers systems outperform PHP in speed benchmarks. But of more import is the fact that JavaScript has both client side and server coding capabilities. This allows for speedy and sophisticated messaging and data integration which PHP cannot match for its lack of a good client side version.
The bottomline is that JavaScript delivers a significant speed premium for WordPress users able to take advantage of it.
JavaScript’s JSON and AJAX : Data Interchange Preferred Format
JSON-JavaScript Object Notation has over the past 10 years become the primary data exchange format used in AJAX and RestAPI data transfer routines. True, CSV and XML still play major roles in these data interchanges but the flexibility and comprehensive availability of JSON for so many web development languages make it a major player. But one of the major challenges is how to safely encrypt JSON and other data interchange formats. Currently TLS/SSL are leading candidates for robust encryption of JSON.
Now JSON import and export routines are available for both JavaScript and PHP. But JavaScript has two inherent advantages here. First, JSON is JavaScript Object Notation so it will not only be immediately understood by JavaScript programmers but also can be transferred more rapidly in JavaScript routines. Thus, JSON gives JavaScript a speed of coding and a runtime advantage over PHP in the expanding world of data interchange.
Other Performance Measures
Searchmetrics ranks backlinks references to a website and social media presence as key Web measures of success. Neither JavaScript nor PHP provide a distinct advantage in improving these measures. It would also appear that 2 other performance factors, website reliability and security ,would not favor either JavaScript or PHP. Now some would argue that JavaScript’s
For reliability, both languages deliver strong debugging, error logging and error trapping mechanisms within their syntax and functions. And both languages are subject to a similar profile of security attacks by means of SQL injection, XSS cross site scripting, clickjacking , Mime-type switching and hack attacks on older and more vulnerable versions of their software. However, JavaScript has a faster update cycle because frequent and often automated browser updates prevail in most Web browsers while updates to server versions of PHP tend to have a longer update cycle.
In sum, JavaScript would appear to have a distinct but not overwhelming advantage over PHP in terms of delivering creative content and responsive systems for WordPress. Clearly, as we have seen, Web speed is vital for high performing websites and JavaScript certainly delivers.
But there is a bit of doubt. It hardly seems to be a compelling case to replace the PHP-based 10,000 themes and 40,000 plugins with JavaScript ones just for the sake of a speed advantage. These PHP plugins and themes are the key elements of WordPress success. What else makes JavaScript compelling?
The WordPress.com Factor
WordPress.com, the online version of WordPress that provides free hosting but premium themes, domain name and other services; has a market valuation of about $1.16B, 321 employees, and in 2014 obtained $160M in financing. WordPress.com is a growing business whose revenues were $45M in 2012 but are hard to pin down more recently.
But WordPress.com has some serious competition in its self-hosted Web Building marketplace which is its primary source of revenue. In rankings of the top 10 Website Builders WordPress.com does not even show up. Rather vendors like Wix, Weebly, Webydo, Squarespace, and others dominate the rankings. Their advantage is easy to use, interactive, drag-and-drop Website design systems. WordPress,com simply does not have such website building tools.
Users of WordPress.com have to switch to a hosted version of WordPress and use some of the excellent Website Design plugins available there. In addition the competing Website Builder have pre-built templates offering many of the UI components featured in WordPress like sliders, gallery grids, widgets, etc. Even major hosting services like BlueHost, Godaddy, HostGator, WPengine and others are offering premium WordPress support services often featuring very good Website Builders.
So Automattic and WordPress.com have a serious problem – some serious competition. And there are more problems for WordPress.com on the easy Website Design front. JavaScript SPA-Single Page App building systems from Bootstrap, Foundation Zurb, and Ink among others offer easy to use Page Design templates that also include solid UI components. And as seen here, JavaScript now has a very strong set of free and premium libraries. Like hosted WordPress, JavaScript users can say “there is a library for that” for just about every Web design need.
Given the growing competition for WordPress.com, suddenly the move to JavaScript for the WordPress.com UI appears more plausible. The benefits are greater speed including ability to deliver native code apps if required – and online businesses are saying speed is vital to them. There is also the huge JavaScript libraries immediately available to match many of the current PHP based WordPress plugins. There is a small increment in security over PHP because of the faster JavaScript update cycle by browser vendors. There is a small plus in mobile responsiveness over PHP because of JavaScripts dynamic libraries. There is also the fact that in Social Media software WordPress would have a JavaScript base to match Facebook, Google and others. In sum, given the competition to WordPress.com, the move to JavaScript over PHP looks much more business rational.
Summary
Automattic and therefore WordPress are making a move from PHP to JavaScript, based in part on some system advantages of JavaScript over PHP. But in addition, WordPress.com competitive needs have also driven this decision and major change for WordPress users and developers. What will be fascinating to see is how Automattic manages the pace and cost/benefits of this change over.