Chapter 3 - Browsers and Web Platforms

Fall 2015

Professor: Miguel V. Martin, PhD, PEng

Mobile Web ProgrammingChapter 3: Browsers and Web PlatformsNotes extracted from “Programming the Mobile Web” by M. Firtman, O’Reilly, 2013.

• Web Platforms that Are Not Browsers• Mobile Browsers

Chapter 3. Browsers and Web Platforms

2

• Browser-based websites or web apps• HTML5 apps• Web views• Native web apps• Ebooks

Web Platforms that Are Not Browsers

3

• iOS web apps. From a mobile website to a full-screen HTML5 app

Web Platforms that Are Not Browsers: HTML5 Web Apps

4Source: Firtman, 2013

• Chrome apps (a.k.a. packaged apps)– Supported for desktop and notebook– Available on Windows, Mac, Linux, and

Chrome OS through the Chrome Web Store

– Android TBA…

Web Platforms that Are Not Browsers: HTML5 Web Apps

5

• Firefox open web apps– Supported on all Firefox platforms

(desktops, tablets, and smartphones)– Available through the Mozilla Marketplace

Web Platforms that Are Not Browsers: HTML5 Web Apps

6

• Symbian standalone web apps– Similar to iOS web apps!

Web Platforms that Are Not Browsers: HTML5 Web Apps

7

• S40 web apps– For mid-range device series, Series 40– Cloud-based apps distributed through the

Nokia Store

Web Platforms that Are Not Browsers: HTML5 Web Apps

8

• Samsung web API– SDK to create apps for smartphones and

smart TVs using web technologies and a JavaScript API

–Supports mobile web apps, TV web apps, and convergence web apps which interwork between a Samsung smartphone and a TV

Web Platforms that Are Not Browsers: HTML5 Web Apps

9

• A web view is a component inside a native app which allows for the embedding of web content– E.g., Twitter app

Web Platforms that Are Not Browsers: Web Views

10

Source: Firtman, 2013

• A pseudo-browser is a web view from the operating system

Web Platforms that Are Not Browsers: Pseudo-Browsers

11

Source: Firtman, 2013

• One approach is to develop them using web technologies (HTML, CSS, JavaScript) but package them as native applications so they can be distributed through the stores

• Another approach is to combine native UI components with only some parts in a web view, with JavaScript logic

• OSs that support the creation of packages that can be distributed as native apps while being developed using HTML5:– Blackberry WebWorks, Windows 8 HTML5

apps, Tizen apps, Symbian WRT, QtWebKit, Ubuntu for mobile apps

Web Platforms that Are Not Browsers: Native Web Apps, Packaged Apps, and Hybrids

12

• OSs that support the creation of packages that can be distributed as native apps while being developed using HTML5:– Blackberry WebWorks, Windows 8 HTML5 apps, Tizen apps,

Symbian WRT, QtWebKit, Ubuntu for mobile apps

• Apache Cordova and Adobe PhoneGap– PhoneGap was the first to offer a multiplatform solution for

native web development. It was acquired by Apache and donated to the Apache Foundation under the name Apache Cordova

• Sencha Touch– Includes a native packager for iOS and Android for Windows and

Mac developers

• Appcelerator Titanium– Allows the creation of iOS, BB, and Android native web apps. It

converts JavaScript to native code

Web Platforms that Are Not Browsers: Native Web Apps, Packaged Apps, and Hybrids

13

• New ebook readers support HTML5 and web content based on different formats such as EPUB3 or Kindle Format 8

• So, we can create interactive ebook experiences with HTML, CSS, and JavaScript

Web Platforms that Are Not Browsers: Ebooks

14

• Safari on iOS. WebKit-based, bundled with iOS. It doesn’t follow the same versioning as Safari desktop

• Android browser. Android OS used to include AB (up to 4.0, Ice Cream Sandwich). AB is WebKit-based too. Google Chrome for Android is replacing the AB

• Google Chrome. Since Android OS 4.1 (Jelly Bean) it is the bundled browser. One of the best HTML5 browsers in the market. The iOS version uses the same user agent name as Safari adding a string called CriOS!

Mobile Browsers: Preinstalled Browsers

15

• Amazon Silk. Kindle Fire family. Based on the Android browser. Proxy browser which does parsing in some Amazon servers delivering compressed results to the browser

• Internet Explorer. One of the first mobile browsers in the market. Uses their own proprietary engine called Trident

• Nokia Browser for Series 40. Designed for feature phones. Focus navigation. Based on Nokia’s own rendering engine

• Nokia Browser for Symbian. Supports HTML5. Designed for S60s

• Nokia Browser for MeeGo. Not many devices support it

Mobile Browsers: Preinstalled Browsers (Cont’d.)

16

• webOS Browser. Bundled with the HP OS. WebKit-based• BlackBerry Browser. WebKit-based• UC Browser. #1 browser in the Chinese market (#2 in India).

Cloud-based browser supporting full HTML and JavaScript. Works in some 3,000 different mobile device models including Android, Symbian, BlackBerry, Windows Phone, and the iPhone

• Samsung Dolfin & Jasmine. WebKit-based bundled with the Bada OS. Installed on social devices and supports HTML5. Jasmine is meant for low-end devices, based on proprietary engine

• NetFront. For low-end and mid-range devices including phones, digital TVs, printers, and game consoles. Preinstalled on Sony Ericsson, Lg, Samsung, and ZTE devices as well as in Amazon Kindle, PlayStation 3, and Nintendo 3D. Supports HTML5

Mobile Browsers: Preinstalled Browsers (Cont’d.)

17

• Tilt mode feature of NetFront

Mobile Browsers: Preinstalled Browsers (Cont’d.)

18Source: Firtman, 2013

• Others: – LG Phantom. WebKit-based– Myriad Browser. Formerly Openware– Obigo Browser. Used to have 14% of the

market before the smartphone revolution in 2007

– Legacy mobile browsers: MicroB for Maemo, Sony Mobile

– Motorola Mobile. It renders documents up to 10 KB

Mobile Browsers: Preinstalled Browsers (Cont’d.)

19

• Opera Mobile• Opera Mini (proxy browser). 194

million users in October 2012

Mobile Browsers: User-Installable Browsers

20Source: Firtman, 2013

• Firefox. Updated in sync with the desktop version. Uses same Gecko engine as the desktop version. Preinstalled in the Firefox OS

• Dolphin. Not to be confused with Samsung’s Dolfin. WebKit-based. One of the top HTML5 scores

• Baidu Browser. Most used browser in China. WebKit-based

• SkyFire. For Android and iOS. Transcodes nonmobile documents to make them mobile compatible

Mobile Browsers: User-Installable Browsers

21

22

Source: Firtman, 2013

• M. Firtman, Programming the Mobile Web, O’Reilly, 2013. Ch. 3.

Further Reading

23