Apps: The Web Is The Platform

kumar303

5 responses

In 2011, it happened: people in the US started spending more time on mobile apps than on the web. The web is in danger. Apps are for real. As web developers we need to stand up, take notice, and help the web adapt to a world of apps. Android and iOS are dominating the apps space but these systems are islands of incompatible technology (Objective C, Java) that result in vendor lock-in. As a developer you have to choose which platform to develop for; ideally you want to build one app for all platforms to reach the best audience. As a user you can buy Angry Birds on your iPhone but if you switch to Android you have to buy it all over again. Each new app platform is repeating this same broken pattern as they enter the game.

At Mozilla we’ve been working hard to create an apps platform backed entirely by the open web. It’s not a “Mozilla platform” nor is it a “Firefox platform,” the web is the platform. We’re creating a set of open APIs and implementations to show how portable apps can exist on the web without vendor lock-in. Other groups like Facebook and Chrome OS are also working on apps platforms backed by the web but so far they seem to be going down the same vendor lock-in path just like iOS and Android. Facebook apps are meant to hook into Facebook and Chrome apps only run on the Chrome browser or on Chrome OS devices (surely this wouldn’t be difficult to change though). We continue to collaborate with the Chrome team as app standards evolve and we definitely share a lot of the same vision. There is tremendous potential for all web based app platforms to converge.

Open Web Apps

In Mozilla’s design, an open web app is just a website that can be installed on a device and used like an app. To create an open web app you publish a JSON formatted manifest file on your domain. Here’s more information on how to create a manifest. The format is very similar to that of Chrome OS and we’re trying to keep them in sync whenever possible. Here is a snippet from Twitter’s manifest file for their existing web app at twitter.com:

{
    "version": "1.0",
    "name": "Twitter",
    "installs_allowed_from": ["*"],
    "description": "Twitter for mobile",
    "default_locale": "en",
    "locales": {
        "en": {
            "description": "Twitter for mobile"
        },
        "es": {
            "description": "Twitter para móviles"
        },
        "zh-cn": {
            "description": "Twitter 移动版"
        },
        ...
    },
    "icons": {
        "114": "/images/apple-touch-icon-114.png",
        "128": "/images/apple-touch-icon-128.png"
    }
}

That’s it! With a manifest file you have an open web app. Here’s more info about building apps and submitting them to Mozilla’s marketplace. Read on to learn how open web apps can run on any HTML5 device.

Hosted apps will be the preferred way to deliver an app (ideally optimized for offline capabilities) but we also had to create a packaged app solution. It’s not very webby but this was the only way we could have a trusted marketplace sign the code used by an app. This enables the runtime to grant sensitive permissions such as sending SMS messages (if abused, such a privilege could result in costly fees).

Buy Once, Run Everywhere

From the ground up Mozilla has been building an apps system that lets users buy an app once and run it on all of their HTML5 devices. Very soon Mozilla will launch the first Firefox OS phone but that will be just one device on which to run your apps. When you purchase an app through our marketplace or any other compliant marketplace the system installs a receipt on your device. The receipt is a JSON Web Token with metadata that links to the respective marketplace’s public key and its verification service URL. When an app starts up it verifies the receipt but the receipt on the device is not tied to Mozilla’s own marketplace. The receipt is just a cryptographically verifiable proof of purchase. Anyone can sell open web apps if they follow the receipt specs. When you buy an app, it is portable across any device that supports our specified apps system.

In parallel to Firefox OS, Mozilla is building the infrastructure needed to run these apps on any HTML5 device. Of course, all of our open web app APIs are published for anyone else to implement too. Firefox for Android will let you install and run apps (you can try it today on the nightly build). Installed app icons go to your home screen just like regular Android apps. You can also install and run web apps on your Windows, Mac, or Linux desktop using Firefox (this currently works in the nightly build). If you want to run your purchased app on another browser, you can do that too! Currently you would have to load the apps runtime as a hosted JavaScript shim for that to work. This should work in any standards compliant browser such as Chrome, Safari, Opera, IE9, etc. In the future we will support syncing your installed apps across devices. Since receipts are portable you could just sync them yourself if you wanted to. In case it’s not obvious, you can always run a free open web app in any browser because it is no different than a website. It might, however, use new mobile phone specific APIs, which I will discuss in the next section.

Is HTML5 Ready For Mobile Apps?

It is! Mostly. Over recent years HTML5 APIs and performance (specifically JavaScript performance) has caught up to native apps or is at least good enough for most apps. However, Apple is not much help by excluding the JIT from their embeddable UIWebView and it doesn’t seem like it will be enabled soon. When we set out to build Firefox OS we wanted all apps to be built in HTML5; we used existing APIs when it made sense and created new APIs as needed. Check out arewemobileyet.com to see a visualization of all the completed and in-progress APIs. We looked at all the parts of the phone — all the sensors — and made an HTML5 API when there wasn’t one. On Firefox OS even the dialer is written in HTML and JavaScript. When you dial numbers and place a call, the code is working with the WebTelephony API.

Commerce For Apps

Part of the success of mobile app platforms like iOS and Android is they make it very easy to try out new business models through mobile payments. Those models are still evolving but commerce is no doubt something that is awkward on the desktop web and more natural on mobile. Specifically, it’s very convenient to charge something to your phone bill when you’re already accessing it from your phone anyway. With the launch of Firefox OS, the apps ecosystem will support app purchases and in-app payments through the navigator.mozPay() API. That API is still going through some changes but will be available in some form. Supporting commerce is crucial for the growth of an apps platform. The use of our payment API is completely optional. We won’t prevent any app from using its own in-app payment system.

Open For Collaboration

As with any Mozilla project, Firefox OS (AKA Boot To Gecko) was open source from day one. As soon as the repository filled up with code and people saw what we were doing, they approached us and asked how they can get involved. Some admitted to building similar mobile operating systems in secret. This led to our initial partnership with Telefonica who will be launching the first Firefox OS phone in Brazil next year. Telefonica is committing code to our repositories and participating in the design of the system. Many other partners like Deutsche Telekom and Qualcomm are working with us. Another perk of working in the open is that hackers get excited about what you’re building. Firefox OS has already been ported by the community to the Raspberry Pi and a Panda Board.

Web Components

HTML/CSS has evolved into a powerful way to render web screens but it is still a very low level building block. App developers (and entrepreneurs) need the ability to try out ideas quickly and an operating system needs a consistent UI. Mozilla sees a challenge here where if we don’t provide some kind of SDK for web apps then the ecosystem of apps might lack usability and consistency. We needed something higher level than what HTML5 building blocks offer, we needed an SDK to build apps with. There are several libraries and frameworks already attempting this and there will definitely be more but we’re working on one as well. The project is called X-Tags and it provides developers with cross-browser web components suited for open web apps. As it evolves, we hope to use it as a way to inform a standard, all-purpose set of web components. This larger effort is tracked in a W3C spec.

Identity

If you take a step back from apps and look at the web as a platform, there is a growing problem that Mozilla has been working to solve: you do not own your online identity. Typically, some other corporation owns it. To fix that, a team of folks have built a federated, decentralized online identity system called Persona. It defines a common set of URLs and formats that anyone can implement to become an identity provider. For users, it means you can log in with any provider you choose and if you switch providers your identity remains the same. It’s similar to Open ID but different: You log in with an email address, the user experience is smoother, it can be integrated deeper into browsers / devices, and it’s more secure. Owning your own identity enables you to to purchase an app and run it on any device you choose.

Get Involved

Open web apps are evolving rapidly and will only move faster once the first Firefox OS device is in the hands of real users. Help us build it right! Here are some ways to get involved.

5 responses

  1. And wrote on :

    What is the difference between an App and a website? That is, why would I create a manifest file at all? There are already common ways of specifying title and description for a site, and granting permissions by domain or url is also common (e.g. cookies, store-passwords, allow-popups — although UI could be improved). Do the functionality overlap with that of the cache-manifest?

  2. kumar303 wrote on :

    The web as we know it is way too browser specific. On a mobile device, the browser is a second class citizen. Apple’s ipad and the revolution it ignited proves that people understand apps. Apps offer a different experience and I don’t think there’s any reason to fight it.

    The difference between an app and a website is that you can install an app and integrate it into your device better. It’s not a bookmark, it’s part of a system. When Web Intents / Web Activities are baked into more devices I think the importance of system integration will be more apparent. http://webintents.org/

  3. Matěj Cepl wrote on :

    Proprietary is proprietary as long as it doesn’t work elsewhere. When I go now to
    https://chrome.google.com/webstore/ with Firefox I get “You will need Google Chrome to install most apps, extensions and themes.” When I go to http://marketplace.mozilla.org/ with Chrome I get …? (well, nothing because Mozilla Marketplace is kind of vaporvarish, but when the Marketplace will be finally revealed) Will I be able to install webapp from Mozilla Marketplace to my Chrome/Safari/IE (if I used it)? I guess not, right? Unless any (ordinary) web browser can install the app, the web is not the platform, Firefox is. Open doesn’t mean anything unless it is real (think about X/Open and Open Software Foundation).

    You know what’s needed … to sit down with other browser manufacturers and adhere to one standard.

  4. Alex wrote on :

    I would like to test apps here is my https://mozillians.org/en-US/zaabs

  5. kumar303 wrote on :

    Hi Matěj, when you run a paid Chrome app on their system the app has to work with an oauth / REST service (a Google service) to verify the paid app. When you run an app on Mozilla’s system you work with a JSON formatted receipt that is not tied to Mozilla’s system in any way. It allows anyone else to participate as a provider of paid apps. We are trying to work with Chrome on all these formats but the idea of apps is in its infancy. I think we will reach consensus one day and a standard will emerge. It’s hard to get it started; we have to start somewhere.