Giter VIP home page Giter VIP logo

swwebview's Introduction

SWWebView

UPDATE: the Guardian Mobile Lab has closed and this repo has been archived as a snapshot of the work we completed. If you're looking to use SWWebView today please look at the forks of this project, such as https://github.com/lexrus/SWWebView.

What is this?

First and foremost, it's an experiment. So it is in no way ready for production use. It's just a kernel of an idea slowly being fleshed out.

That said, it is a collection of modules that, when put together, provide an almost drop-in replacement for WKWebView that supports various Service Worker APIs. It's for apps only, it'll never work inside Safari, and even when it's complete I doubt it will be safe to use as a generic browser app, just with your own code. If you are thinking of using it, or if you think it's an abomination, I'd encourage you to read about why you might or might not want to use it.

It's split into three modules, each depending on the previous one:

  • ServiceWorker

    The core module that actually provides a JavaScript environment in which you can evaluate code and dispatch events. It provides the following APIs inside that environment:

    However, the ServiceWorker module does not persist any data or information at all. So most of those APIs send requests out to delegate methods. Many of those delegate methods are provided by...

  • ServiceWorkerContainer

    This module provides the data persistence and lifecycle methods that make ServiceWorkers usable between sessions. It stores workers, cached files and databases in SQLite format in a location specified by a delegate (it's delegates all the way down). In addition to delegates for ServiceWorker, it provides:

  • SWWebView

    A subclass of WKWebView that injects JavaScript to create a version of the Service Worker API you can access like you would the real thing in Chrome and Firefox. Allows you to register, unregister and postMessage to a worker. Sends fetch events through the worker when it is in control of an SWWebView. As you might imagine, there are a lot of tradeoffs and caveats involved in getting it working.

Requirements

  • XCode 9 (and iOS 11 on devices)
  • Node 6 or above

Installation

The project uses Carthage for iOS dependencies and NPM for JavaScript dependencies. So make sure you have both installed. Then:

  1. Clone this repo
  2. Go to the repo directory and type carthage bootstrap to install the iOS dependencies.
  3. Go to the SWWebView/js-src directory and type npm install to install the JavaScript dependencies

Running

Right now the easiest way to take a look at the project running is to open SWWebView/SWWebView.xcworkspace and run the SWWebView-JSTestSuite target in the simulator, which is a very simple app that will create an SWWebView and point it at localhost:4567. In order to run the test suite, go to SWWebView/js-src in the terminal and type npm run test-watch, which will transpile the JS and start a web server. You can also load localhost:4567 in Chrome or Firefox to verify that the tests pass in all environments.

Contributing

If you're interested in the project and want to contribute: you are brilliant. But I'd hold off getting too excited just yet - I still need to go through and add a lot of comments to the ServiceWorkerContainer and SWWebView modules (I know, I know, I should do it as I go along) so that it's even possible to work out what's going on. Then identify which features are missing and how they might be implemented. Then we're good to go.

But for now, take it for a spin! If you see anything that behaves weirdly or if you have any thoughts on the project in general, please do let me know.

swwebview's People

Contributors

alastaircoote avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

swwebview's Issues

FetchRequest should have body functions (text(), json() etc) too

In browsers, you can run text(), json() and so on onRequest, the same as you can Response, because they both inherit from Body: https://developer.mozilla.org/en-US/docs/Web/API/Request

We should do the same too, to allow workers to parse content sent in (even factoring in the caveats of #1). Things to do:

  • abstract out these functions from FetchResponse into a new FetchBody class, have FetchResponse inherit from it
  • have FetchRequest also inherit from it, and read in the request body as an InputStream.

Add a LICENSE file

Without a LICENSE file all the work contained in this repo is considered to have their copyright assigned to the author. Adding a LICENSE file to the repo will help make it easier for others to contribute to this repo.

WKURLSchemeTask does not pass along HTTP body

I've opened a bug for this: http://www.openradar.me/radar?id=4952053319204864 but so far no replies.

Any POST request coming from SWWebView doesn't have its HTTP body attached. Right now I have a very horrible patch on fetch that inserts the (string) body as a header before performing the fetch. The native code repatches this to be the actual body so no backend code ever needs to be aware of this, but there are still a lot of issues:

  • It only works with strings.
  • Presumably there is a character limit eventually.
  • It doesn't cover POST page requests, and I don't know how it could.

There are some stopgap fixes we could implement:

  • base64 encoding (to allow non-strings)
  • sending the body though the JS API, returning a unique ID, then sending that in the header (to get around character limits)

But they're all pretty awful. Unfortunately the only real fix I can see is Apple fixing the original bug, but depending on how long that takes, we might need to implement some stopgaps. In the more immediate term, we could get some tests going to see what these character limits actually are.

Notifications

This is a meta issue that will have to be split into multiple issues at some point, because there's a lot to do here.

Difference between iOS and Web APIs

The most fundamental and important difference is that the Web APIs are split between Push and Notification APIs. Right now Chrome enforces that you must show a notification in response to a push, but with the Budget API that's going to change.

iOS has a split, sort of, but it's not one that is very useful. You can send a silent notification, which would serve as the equivalent of a web push, but:

  • it's throttled much more aggressively than a non-silent notification
  • the app must be active in the background in order to receive it. This means that if a user has swiped the app out of the task switcher, you won't receive the notification at all.

The combination of those two factors leads me to think that I'd rather enforce that you have to show a notification in response to a push than mess around with silent notifications (maybe in the future we can make it a customisable thing). But this opens up a new issue: traditionally, the content of an iOS notification is decided on the server, not the client. So we wouldn't be able to mirror the web APIs for customising notification content locally. But...

Notification Service Extension to the rescue, ish

In iOS 10, Apple introduced Notification Service Extensions. They're small targets, separate from your main app, that are spun up whenever you receive a notification, and before it is displayed. Within a certain time limit, you can customise the contents of this notification before the user ever sees it. So we can spin up the worker, run the push event and listen for a showNotification call. But two big issues with these extensions:

  • They run on a very, very tight memory limit. Apple doesn't say what that limit is, and I suspect it's dynamic, or depends on device. However, I ran some encouraging early tests that were able to create a JSContext, and assign an ArrayBuffer of about 8MB before the process was terminated. So we have some space to play with, I'm just not sure how much (once the rest of the worker APIs are added, which they weren't when I did those tests)

  • They're in a separate process to the main app. It's quite plausible (likely, even) that a worker might call update() in response to a push, which might result in an entirely new worker being installed. The main app won't be aware of any of that happening. So somehow we need the extension to check if the main app is active in the background, and send updates over as needed.

Things to do

  • Implement local notifications. By comparison to the rest of this, that's pretty easy.
  • Set up those same tests I had running before to check that the worker runs OK in an extension. The only way to test one is to manually send notifications, so it'll take some work to get that going.
  • Work out methods for cross-process communication
  • Make an entry point that people can run in an extension (don't make an extension itself) that'll indicate whether it handled the push or not.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.