Storage space still matters: the more we have, the more we use. In these markets, PWA can be a complement to the native app, especially for users who have migrated from the native app to free up storage.

Remember that even in developed markets, a large number of people use mid-range devices. PWA can help you reach each in a cost-effective way.

The following strategies show how companies with different needs can use PWA to offer the best possible experience to the largest number of users.

Strategy 1: All-in on the network
Go all-in and rely solely on a progressive web application to provide a great experience for all users at minimal cost. With a single codebase and design, resources can be focused on creating new features and capabilities.

For businesses that:
Do not have their own application
Have had a bad experience with applications
Or have their own application that relies heavily on web content
Development:

Publish a PWA to Play using Trusted Web’s actions. This can be the most cost-effective solution for large online companies looking to enter the Play Store.

Promotion:
Browser: promote PWA installation to all users.
Store: publish PWA to Google Play using TWA.

Pros:
Can replace an outdated Android app that barely gets any updates or has a poor user interface. Tip. It is especially easy to replace an outdated hybrid app with PWA.
Consolidation of all mobile development in a single code base.

Cons:
Not suitable if you need features that are not available on the web.

Strategy 2: Supplement the application with a compatible PWA – ‘Lite App’
PWA Lite App.
The terms “Lite” and “Go” were coined to distinguish a lighter, faster, but sometimes less specialized web app from a native app, for those companies that want to offer both.

For companies that already have a great native app, a progressive web app branded as “Lite” can help users who would never install a native app, such as those on mid-range devices.

Development:
Create a progressive web application. Publish the PWA to the store using Trusted Web actions. Use the name “Lite” to differentiate it from the native app.

Promotion:
Browser: Promote the installation of your native app to users. If they refuse, promote the PWA using the “Lite” offer.
Store: publish the PWA on Google Play with TWA and use a special name so that users can distinguish it from the main application and choose the interface they prefer.

Pros:
Ideal for companies that have an excellent but “heavy” native Android app and are looking to offer a better experience for users of mid- to low-end devices and/or users in areas with poor internet connections.

Cons:
Need to manage two listings in the store and use analytics to thoughtfully segment users to promote PWA or Native App from the browser.

Strategy 3: Separate apps for separate tasks
For many businesses, a progressive web app can provide the core reach and conversion rate, while a native app can offer additional services designed only for specific use cases and offer specialized functionality.

For example:
A retailer may offer a main store as a PWA and a separate magazine/blog app.
An insurance company may offer basic information and lead generation in a PWA, and a separate app for chat/helpful experience/customer service.

Development:
Create a progressive web application. Publish PWA to the store using trusted web transactions. Also create and maintain additional applications.

Promotion:
Browser: promote PWA to all users. Offer a specialized custom app only to those users who have already completed certain trigger conversion tasks and will benefit from additional features.
Store: have separate store entries for PWA published using TWA and the specialized native app, clearly indicating in the listings what is in each app.

Pros:
Most suitable for businesses that have direct conversion goals and require a native app for niche services only.

Cons:
Not suitable for businesses that do not have additional services.

The post Strategies for developing progressive web applications appeared first on In-Novation-Fort.

• The possibility of browserless work. This feature gives the user access to information in one click, which means that the involvement increases: the client can quickly visit the resource at any convenient time.
• Cross-platform compatibility. A standard mobile application works only on those platforms for which it was developed (Android, iOS, Windows). At the same time, PWAs are able to work on almost all hardware platforms, which reduces the cost of development: you do not need to create a separate product for each operating system, it is enough to develop one universal PWA application.
• Offline mode. Without an Internet connection, the user can view information and even send HTML forms. In this case, the data entered by the site visitor in the form is temporarily stored on the device, and as soon as the connection to the Internet appears, they will be sent to the server. Imagine, for example, that you started filling out an order form, and then went into the subway and the connection was interrupted. On a regular website, if you then press the submit button, your data will disappear, while PWA will save all the information and send it at the first opportunity without your participation (an example of an offline form is at the very top of the page).
• Push notifications. Users will be able to receive convenient notifications about promotions, new articles and other events of your resource. Note that you can receive these messages even without installing PWA (an example of push notifications is at the very end of the page).
• Improved conversion. This is rather a consequence of the above points: when working with PWA, the likelihood of a client re-entering the site increases, the time he spends on the resource improves, the user experience improves, which in the long run helps to increase conversion when it comes to a commercial site.
• Indirect impact on SEO. Progressive mobile applications demonstrate good behavioral factors (users actively navigate through pages, lower bounce rate), which can positively affect search rankings. PWA works only with a secure protocol (HTTPS), and this also has a positive effect on the position of the site.

Disadvantages of PWA technology

• The first loading of a PWA page can be a little slow, which is critical when the Internet connection is very weak. This is due to the fact that at the time of the first login there is no information in the cache about the resource.
• The total size of PWA is limited by certain requirements that depend on the user’s browser: no more than 6% of free space on the device for Chrome, 10% for Firefox, 50 MB for the mobile version of Safari or 250 MB for Internet Explorer. It is quite difficult to calculate the exact limit, since the degree of device memory utilization may be different for each user. Therefore, when creating PWA, you have to reduce the size of all resources as much as possible to minimize the risk that some of them will not fit into the cache.
• PWA technology is more difficult to implement on a ready-made website because it requires maximum content optimization.
• If you work with a PWA site through a browser, then clearing the browser cache will lead to the irreversible loss of data related to the site and the inability to visit the resource offline until the Internet is available and the data in the cache is overwritten.
• Many functions of PWA sites cannot work properly when the “incognito” mode is enabled in the browser.

The post Advantages and disadvantages of PWA technology appeared first on In-Novation-Fort.

When you get to a PWA site, it shows you the following message: “Do you want to add this site to your home screen?”

An example of installing pwa on the home screen of a mobile device
If you click “Yes”, then:

the site icon will be added to the screen of the mobile device;
it will be installed by analogy with how a regular mobile application is installed.

What will it give? Firstly, you now have the opportunity to open the site in one click from the main screen of the device. It would seem nothing unusual, because you can add any site to the home screen for quick access using the browser. But that’s not all: unlike ordinary sites, after installing PWA, you can interact with it even offline, that is, in the complete absence of an Internet connection. How? We installed it on our device, remember? In addition, when you are online, PWA can synchronize data and update them in the device cache. The news feed in the Facebook application works in a similar way: when there is no connection, the information is removed from the cache, and you see the content relevant at the last moment of accessing the Internet. But as soon as the connection appears, the application will download the latest information from the server, and you will be able to see the latest entries and photos; the data in the cache will also be updated.

In addition, after installation, PWA will work independently of the browser (that is, it will not open in Chrome, Opera or Safari, but in its own window).

Uninstalling (uninstalling) PWA from the device is carried out in the same way as regular applications.

It is important to note: if you do not want to install PWA on your device as an application, the site will still fully retain its functionality, but will work only in the browser.

Even taking into account the above, a PWA resource is still a website: you can get a link to any of its pages, send it via messenger or post it on a social network; it is also indexed by search engines.

In order for you to better understand how PWA works and what it can do, we have prepared for you an example with the main functions of the technology. You can see it at the link below (the example does not work in “incognito mode”; when you go to the example page, our site will ask you for permission to receive push notifications – please agree. This is only to demonstrate how PWA works – we will not send you any further notifications).

The post How does PWA work and what can it do? appeared first on In-Novation-Fort.

ONLINE STORES
PWA technology can be applied to large online stores, but it will be difficult to work with such a resource in offline mode. This is due to the fact that a large store requires a lot of requests to the server when filtering or sorting a large number of products by various criteria. In addition, a lot of photos of products that are undesirable to compress too much may simply not fit in the local cache storage. With stores that have a small product catalog, the situation will be better: their assortment can be displayed on one page and filtered using JavaScript on the browser/application side.

INFO RESOURCES
For such types of sites as a blog, information, corporate resource or service site, it will be easier to set up PWA. This is due not only to the fact that such sites usually have fewer images (compared to online stores), but also to the fact that they do not need to filter or sort content, and new pages appear relatively infrequently. The principle of operation of such an application will be similar to the Facebook feed described above: the background synchronization mechanism will find and download new content when the Internet connection appears.

LANDING PAGES
Finally, for a landing page or business card site, PWA is the easiest way to implement: due to the fact that the content of these resources is practically unchanged, you do not even need to set up background synchronization for them. The entire site will be cached on the device, and the user will be able to access it at any time.

Thus, in theory, PWA can be used for almost any site, but not for everyone it will be appropriate. The decision about the necessity of switching to PWA should be made based on the size of the site, its focus, as well as the goals and objectives of the online business.

Implementation of PWA technology on an existing website
To quickly implement PWA on a ready-made website, it must meet the following requirements

• optimized weight of all images and photos on the pages;
• minimized code of scripts, CSS styles and HTML files. It is highly desirable to use scripts only on pure JavaScript, without the use of third-party libraries;
• preparation of icons of different sizes for the main screen of different platforms (Android, iOS, Windows) on which the application will be launched;
• maximally optimized size of the entire site (due to the limitations of the memory occupied on the device specified above).

If your site does not meet the listed criteria, it does not mean that it is impossible to transfer it to PWA technology – it will just take more time and resources to implement.

It is worth noting that for sites on some popular CMS (for example, WordPress) there are plugins for transferring an existing resource to PWA. However, it is important to clarify that even when using plugins, it is necessary to check and test by specialists: the larger and more complex the site, the more errors and problems may arise during its automated transfer. The same can be said about the EscalatingWeb resource, which offers a fully automatic “conversion” of the site to PWA. Judging by user reviews, it is not suitable for everyone and works correctly only with small sites with a small amount of dynamic content.

Progressive Web App technology is one of the modern trends that can determine the future of the Internet and online business. This was emphasized, for example, by the founder of Moz Rand Fishkin in his forecast for 2018. The most important indicators for modern web resources are usability (UX) and cross-platform compatibility, and progressive web applications perfectly cope with these tasks. Yes, not everything is perfect yet – because the technology is quite new, but it is constantly evolving and expanding functionality, opening up new opportunities for users.

The post Who is PWA suitable for? appeared first on In-Novation-Fort.