2

I've read a few post saying that the amazon app uses webviews pretty heavily

(sources: - https://www.quora.com/Why-does-the-Amazon-app-use-WebView-in-their-Android-and-iOS-application and https://www.teamblind.com/post/Amazon-app--webviews-cuT4sN6C)

Now, i've played with webviews a bit in android in the past where i loaded a remote url to the webview and it loaded the exact version of that website onto the mobile app. This to me was expected. So i investigated amazon's ios app and compared it to the desktop website (in mobile view), and indeed they were very similimar. However, there were some elemets that were missing on either or platforms. i'll attach the images below:

(left is the ios app, right is the mobile view of the website on desktop) enter image description here enter image description here enter image description here

Now I have a few questions:

  • when people mention "webview" for amazon's use-case are they talking about the native webview from android and ios like the Webview and WKWebview? (https://developer.android.com/guide/webapps/webview and https://developer.apple.com/documentation/webkit/wkwebview), or are they talking about hybrid app technology like apache cordova or Ionic?

  • If it is indeed a native webview container, can you edit the html to remove some elements? like how some stuff were missing from the mobile app that weren't on the desktop website. And also add stuff like now the mobile app has "Buy Now" button, and the "favourite icon"?

  • How far can i go with Webviews, in terms of having access to native features like camera, gps and all that good stuff?

EJoshuaS - Stand with Ukraine
  • 11,977
  • 56
  • 49
  • 78
Barcode
  • 930
  • 1
  • 13
  • 31

1 Answers1

2

When people mention "webview" for amazon's use-case are they talking about the native webview from android and ios like the Webview and WKWebview?

Yes, they are indeed framework webviews.
But there is a good chance that they use hybrid app tech.

If it is indeed a native webview container, can you edit the html to remove some elements? like how some stuff were missing from the mobile app that weren't on the desktop website. And also add stuff like now the mobile app has "Buy Now" button, and the "favourite icon"?

You can edit html to remove / add elements using javascript in webview BUT this is not the case here.
These sites have a specific different UI for different devices. (Desktop / Mobile)
For example: Flipkart uses a mobile version on apps which is not available on browsers, except Chrome on mobile (I guess). It just redirects the user to the respective app store to download the app.
I assume it is done by checking the User-Agent field.

How far can i go with Webviews, in terms of having access to native features like camera, gps and all that good stuff?

You can use camera and gps via webview.
More info. here and here.

Darshan
  • 4,020
  • 2
  • 18
  • 49
  • 1
    when you mentioned that amazon probably uses hybrid app tech, what kind of technology do you think this is? and also if thats the case, are they re-using any parts of the website to be used in the mobile app? Because you also said that they have specific different UI for different devices (mobile/desktop), but i find for most pages on the amazon app. it's almost identical when comparing the mobile app vs the website (in mobile view) – Barcode Mar 26 '20 at 06:47
  • @Barcode it's doesn't have to be a hybrid tech. They have an in house library that works like https://github.com/hotwired/turbo-android – Alexander Suraphel Feb 28 '22 at 11:00