Continuous Testing and Progressive Web Apps

This article is featured in the new DZone Guide to Automated Testing: Your End-to-end Ecosystem. Get your free copy for more insightful articles, industry statistics, and more! 

Continuous testing (CT) is all about getting feedback to developers more quickly. In theory, this should increase their productivity and allow them more time to innovate. Whether you subscribe to an "Agile" philosophy, a DevOps methodology, or the principles of Continuous Delivery, in practice, it takes automation to make CT work.

In the current era of digital transformation, organizations are always looking for new ways to offer a better user experience (UX) in their online offerings. Traditional web and native app technologies have steadily given way to responsive web design (RWD); for a few years now, it may have looked as though RWD was the best hope for developing a universal cross-platform experience for end users. Recent developments (especially Apple's decision in March of this year to finally back "service workers" and Google's solution for adding more app-like capabilities to the web experience) mean that developers now have a new technology with which to create a uniform experience across all platforms:  progressive web applications (PWA).

PWAs are a powerful new tool for ensuring a great UX within the confines of mobile web technology; however, they do require a re-think regarding how to implement continuous testing.

Continuous testing begins with the developer, who can run unit tests as part of every local build. Once the code is checked in, integration and other system-level tests are run automatically. If those tests pass, automated end-to-end tests can run in order to ensure that things still work as expected. Other testing — stress tests, performance tests, or other large tests — may also be run before the code is deemed ready for release. After this point, monitoring and alerts are (for some devs, anyway) other types of testing that may happen during production.

Basically, CT is lots of tests, each running at the most appropriate point in the development cycle.

Testers want to create tests that will find issues with the customer experience. They also want to get feedback from tests as quickly as possible; to make this happen, they target their tests to find issues at the earliest possible time. Bugs that can be found by unit tests should be found by unit tests. The same is true for acceptance and integration tests and is especially important with end-to-end tests. While a lot of automation efforts focus on end-to-end tests, they should only exist for bugs that can only be found with end-to-end tests.

Software products with good CT systems enable teams to deliver changes and updates to customers frequently and safely and to use testing at every single integration point to help us determine whether we're heading in the right direction. In the context of CT, one promising aspect of PWAs is that teams can release as frequently as they see fit — directly to the user's device/browser without having to go through the process of clearing it through the Apple App Store or Google Play Store.

CT is not just about having a lot of automation. It's about having the right automation running at the best possible time to find issues. For some web services, automated tests may be all you need in order to produce a good product. The amount and types of testing you do, your desired shipping frequency, your customers, and various risks all combine to help you make this business decision.

Progressive Web Apps: New Tech, New Challenges

Across the board, early reports confirm that progressive web apps improve user experience, grow engagement, and increase conversions. PWAs offer users access to features that, until now, were restricted to native apps: browsing while offline, receiving push notifications, and having access to platform features like cameras, microphone, speakers, data storage, and GPS. These capabilities are propelling PWA adoption and enriching user experiences. Everyone seems to agree: PWA adoption is expected to increase. In a recent survey conducted by Perfecto, 41% of respondents plan to add PWA capabilities to their sites already, followed by a responsive web design over the next 12 months, with an additional 32% actively researching the transition. Gartner has stated that by 2020, 50% of all native apps will transition to PWAs. Teams are seeing the benefits of PWAs and taking notice of their success and efficiency.

Instead of remaining a niche tool for the Android market, with Apple's change of heart, PWAs became a viable way of re-imagining everyone's internet presence, on all platforms. As the technology develops, we can expect new levels of creativity and features. For the time being, the data seems to suggest that big companies are using PWAs as a way to start with a fresh/lean codebase while devising ways to cut page load times — and to great effect. Take a quick look at a few examples of companies that are starting to see big payoffs from making the switch to progressive web:

Starbucks

Their PWA achieved results well beyond the main scope of the project. Simply by the nature of the specific requirements of a PWA, the final version of their PWA clocked in at 233KB —99.84% smaller than their 148MB (that's megabytes) mobile iOS app! Naturally, this enormously improved load times and responsiveness, making the web app a hit with users.

Tinder

Tinder took three months to build and implement their MVP progressive web app based on React and Redux. The result of their efforts is delivering the core Tinder experience at ten percent of the former data costs for someone in a data-costly or data-scarce market. They managed to shrink their 30MB native app to a 2.8MB progressive web app — which is downright impressive. Additionally, they cut load times from ~12 seconds to ~4.5 seconds.  

Pinterest

With Pinterest's previous mobile web app, users often had to wait as much as 23 seconds before any UI was usable at all. Pinterest set out (much like the previous examples) to create a fast, light experience that would ultimately lead to better engagement and conversion. The Pinterest team reduced the"time to interactive" by a staggering 75%, from 23s to 5.6s.

A Convergence of Efficiencies: PWAs and Continuous Testing

The teams at Starbucks, Tinder, and Pinterest (and others) have all gotten an early jump on PWAs, and now, with support for iOS (as of 11.3), they are well-positioned to offer all users a delightfully fast and robust experience with their lean apps. Developing a PWA seems to be a challenge that teams are rising to meet — but working PWAs into the continuous testing process is another additive element in the DevOps pipeline. Not only are there slightly different features/behaviors to test, but, in addition, there are other native/RWD apps that still need to be supported/tested/developed/monitored. There's no doubt that DevOps teams are subject to ever-increasing levels of intricacy for the entire build-release process. Those teams that pull PWAs into their continuous testing process methodologies are going to be better able to meet user demands for fast, always-available apps that give them the instant gratification they have come to expect.

This article is featured in the new DZone Guide to Automated Testing: Your End-to-end Ecosystem. Get your free copy for more insightful articles, industry statistics, and more!