Industry: Media, Entertainment
Site: goat.com.au
Challenge: Build a new content platform optimized for mobile users, and migrate over legacy content without missing a beat.
Solution: WP Engine's enterprise WordPress platform, Accelerated Mobile Pages, Progressive Web Apps.
Results: The successful launch of a mobile-friendly, performance-focused site
Nova Entertainment is one of Australia’s most recognized media brands with a history of radio, media, and local content stretching back 19 years. As one of the media industry’s most innovative companies and in view of the rapidly evolving media landscape, NOVA Entertainment’s vision is to endure as an entertainment company, with a mission to create content that is loved and shared by audiences, wherever they are.
WP Engine understood our goals for this project and they were a great collaborator to help deliver a superior experience to our customer.
—–Amit Sion, XWP Chief Revenue Officer
A SEAMLESS MIGRATION
The key goals for this project were scale, stability, and self-sufficiency. XWP was looking for a partner that aligned with those goals and ultimately decided on WP Engine.
With a significant amount of content that needed to be migrated, WP Engine helped the team at XWP identify potential risks with migration, allowing the team to put together a clear plan that minimized any possible risks.
UTILIZING AMP + PWA
Over the last two years, XWP has been working with Google on the development of the AMP Plugin for WordPress. With this expertise, XWP quickly saw alignment for AMP with NOVA’s web properties, with Native AMP identified early as the ideal implementation. As opposed to “transitional or “reader” modes, Native AMP means all theme templates are AMP-only, allowing for simpler development with only a single code base.
They also added the PWA feature plugin (that XWP helped build with Google) as well as using AMP install service worker, one of the newer AMP components, to further improve the user experience. Configuring the PWA’s app manifest to have a “network first” caching strategy enabled offline viewing of articles previously visited.
INCORPORATING ADS
The nature of the implementation presented a unique opportunity to work with AMP and header bidding ad-tech. When ad loading is not configured properly it contributes towards poor page performance, especially on media-rich sites like GOAT. Working with AMP, a highly opinionated and performance-focused web component framework meant the approach XWP took to implementing GOAT’s ad stack had to adhere to AMP standards.
Whilst some concessions had to be made to accommodate ad providers that were not fully AMP compatible the overall net effect was a highly performant ad-reliant media site. The best of both worlds: a good user experience that isn’t degraded through sub-optimally loaded ads.
The Results
GOAT is the first of Nova’s sites to go live with a unified editorial workflow and performance-focused theme build—as a PWA site, with all templates built as “Native” AMP. The performance results are noticeable:
- The unification of the editorial experience
- Google Pagespeed Insights score went up from 7 (yes 7) to 77 on mobile.
- WebPageTest 3G test: before/after. Key things: start render time decreased by 1.5 seconds. The time to interactive went down from 43 seconds to just 10.
- Lighthouse test: before/after. First contentful paint went down from 5.8 seconds down to 2.5 seconds (a 3.3s reduction). The performance score went up from 7 to 65. First CPU idle time went down from 16.2 seconds to 5.9 seconds.
- GTmetrix: before/after. The PageSpeed Score went up from a D (63%) up to B (82%).
START UTILIZING AMP
To evaluate your site’s compatibility and gain the performance and user experience benefits of AMP, check out AMPized.com, XWP’s AMP implementation service.
Genesis 3.0, the latest version of the Genesis Framework, brings AMP functionality directly into Genesis core, making it easier for developers to build AMP-compatible themes and sites with Genesis.
By bringing this functionality into the Genesis Framework, sites see faster load times, better SERP (Search Engine Results Page) benefits, and the benefits of AMP caching on mobile. Get started with Genesis + AMP today!
Want more information on AMP and PWA? Check out the official AMP plugin for WordPress or check out our white paper on how to design and develop a progressive web app.