The Web Packaging proposal was recently published by the Web Platform Incubator Community Group (WICG). Web Bundles, more formally known as Bundled HTTP Exchanges, are a key part of the packaging proposal and seek to address the offline distribution, installation, and consumption of web resources.

Web packages provide a way to bundle web resources in one package and transmit them together. These bundles can be signed to establish their authenticity. The proposal states:

People would like to use content offline and in other situations where there isn’t a direct connection to the server where the content originates. However, it’s difficult to distribute and verify the authenticity of applications and content without a connection to the network.

The proposal describes three essential use cases. The first use case is the offline installation of Progressive Web Applications (PWAs). Once installed, the PWA can be used entirely offline. When a connection is available, the bundle may be updated to reflect changes in the application. While running applications offline is already supported by service workers, web packages also address the problem of secure distribution. For example, the PROXX bundle allows users to play the minesweeper game offline.

The second use case is offline browsing. Users may download a file, possibly containing a large website, and browse the site entirely offline. For instance, the entire web.dev site (as of 2019 October 15) can be accessed in a 200MB web.dev.wbn bundle file.

The third use case is saving and sharing a web page, which can be viewed in any browser implementing the proposal. Currently, browsers do allow their users to save pages. However different formats (like MHTML, Web Archive, or files in a directory) are used, which restricts the sharing of the saved pages to a specific browser.

Web bundles can be built using the go/bundle CLI, a reference implementation of the Web Bundles specification. To build a bundle for the TodoMVC Preact app, developers need only (assuming go and go/bundle are installed) to build the app, and run the following command:

gen-bundle -dir build -baseURL https://preact-todom.vc/ -primaryURL https://preact-todom.vc/ -o todomvc.wbn