From IndieWeb

Local first, offline first vs no cloud and multidevices was a session at IndieWebCamp Brighton 2019.

Notes archived from: https://etherpad.indieweb.org/localoffline

  • Session: Local first, offline fist vs no cloud and multidevices
  • When: 2019-10-19 14:45
  • Video: ▶️43:33s



Post to introduce: https://tantek.com/2019/292/t5/indiewebcamp-brighton-local-offline

Tantek Çelik Who's heard of offline first? - What do you see as the difference?

Jeremy Keith Offline first: faster quicker (maybe not fresh). Local first: generate/create/edit/delete

Aaron Parecki Reading vs creating

Jeremy Keith mentions web beacons


Jeremy Keith Offline first from cache. Local first could be "posting" locally (no network) and waiting until online to really post.

Aaron Parecki uses an offline version of Teacup posts with micropub when online

Peter Molnar secure scuttlebutt (SSB) - https://github.com/ssbc - sync with "local" - same local network - clients first, doesn't require over the internet connectivity

Lewis Cowles used it with HospitalRun which is a SPA (JS Node app) using CouchDB & PouchDB to design healthcare solutions which work without persistent network connectivity Lewis Cowles Asked Tantek about LocalFirst the other day as it sounds a little like 90's apps where network was at most optional enhancement

Lewis Cowles also have a ServiceWorker which defaults to checking network, but after 500ms bails to cached copy (attempts to get)


Jeremy Keith See the verbs of creating in above link

Tantek Çelik Principles:

  • no spinners
  • work not trapped on one device (is this true of local first?)
  • network optional
  • seamless collab
  • ... see above link

Lewis Cowles Question? If you are not trapped on a device, do you imply a master-node or outer category / context which persists? For the battery dying case, it seems to imply something has power or remains available

Jeremy Keith Without opening browser background sync can be useful here.

Appears blink only. In development on firefox

Aaron Parecki My thing requires user interaction to trigger.

Tantek Çelik What does seamless mean?

Jeremy Keith Big fan of seamful. You expose the boundaries because it's less magical.

Aaron Parecki Building blocks approach to design.

Lewis Cowles Would existing technologies such as patches be a way to provide seamful design, which the user can reason about? Seems to work for OpenSource & Libre

Tantek Çelik Seams even visible in things like etherpad (colours). Too many seams can be bad, ceremony, git incantations etc. Worse for usability and accessibility.

Jeremy Keith These principles are not technology specific.

Aaron Parecki You should be able to open old files.

Tantek Çelik Security / privacy by default because nothing is transmitted.

Martijn van der Ven My GPS logger is an example. Just logs locally. I can use whatever app to open logs.

Tantek Çelik Maybe local first is in how the timeline starts. Sync happens later to peers or mothership. Then it's offline first.

Martijn van der Ven My software is offline first. Data I create is local first.

Template:note-taker Conflict Free Replicated Datatypes (CRDT) has come up a few times as a means to sync. Sounds like there could be some in-principle issues though.

Lewis Cowles Defining version-ed envelopes and action-oriented schema's / specification formats to assist with editing complex content. What if I wanted to collaborate on an image file (traditionally difficult to diff) Lewis Cowles Perhaps rabbit hole, perhaps #FirstWorldProblems I just was online, but unavailable because I was called to help Lewis Cowles Is Git an example of tool enabling LocalFirst? (not providing complete solution)

Lewis Cowles https://phil.tech/api/2016/05/03/put-vs-patch-vs-json-patch/

Also: http://offlinefirst.org/

Tantek Çelik I think they're talking about the software being local first.

Peter Molnar git is a data type. PR is people side of things.

Tantek Çelik git doesn't require network. Can just be fs and patches.

Martijn van der Ven: the application is offline first, I want to be able to start it without a network connection. But then when I start entering data, that *data* is local first: only existing on the local device. Once the data has been shared in some way (e.g. over the network to a “mothership”) we are no longer in a local first, but the app could actually go back to offline first where the offline cache is now equal to the public/online/shared data. When we are talking data is starts locally, may be stored locally, and is thus local first. Applications have a network connection or no network connection and are thus offline first. (– thought captured after the discussion)

Peter Molnar mks integrity example of mothership

Tantek Çelik Back to practical: 3 scenarios for local first content.

  1. 1. By myself writing. On beach. Focus.
  2. 2. Partial attention: On mobile device. With other people. Short notes. Quick data like teacup. Maybe chatting with other folk.
  3. 3. You're responding to something you're reading. Creating content dependent on offling first context.

Jeremy Keith I consider local last which grabs content and stores it locally. If I close a tab by accident I can retrieve it. Local as enhancement.

Martijn van der Ven Is that not local first_

Jeremy Keith Applies to filling in an online form. Text box works. Firefox restores it.

URL as state limit is 4k of data Lewis Cowles This is client dependent https://itty.bitty.site/#About/XQAAAAI9BwAAAAAAAAAeHMqHyTY4PyKmqfkwr6ooCXSIMxPQ7ojYR153HqZD3W+keVdvwyoyd+luwncAksvskG/my97qDaUEyfDGB0QDbdURMwS0L90o5EpQ7O+BMmWrcB7fs71TJEJv1I/T/JfksoiYu9CqkeO/3MjEVGWv6XhfDjWJZ9laLARogtAZtwl7FltrwO/ppSfgeKOjxCxTNdUQH9WBM3de22qOzClzeZaSsSM+/ETbHBIHe1Qc+UF7PDfY470lZNjQg3wfOam9KudUiHOOQD3Kn8FLfaae0lmdK4VHRgxpDtL1nExkdF+pzNQAIyktIv3dQUPDKhGJ61c+WBTNP6NI5AvZ0uFT+Mc2oG0mMUwwuupCrjTxxpYv3l4L3W5lBXqWDjEH+cL8VZc6xz4WwIMG5J9jaQTv1SSxJ1dLg2Z2F7iNQ0fCFI74yeqBM1koHGbscBj4GpwWuA7y/fMCu3sEzcwefjBOuUwDdDfsdxqQLnjywtBxR5qHmngo/agjHyILkZxU8IiTgJeSbjcEOWdiVxcb9tEdtZ7eDwWQcwMsQdU9A9sCnargxl1IdVsbB9dfcFTQL8OpvjdqnmFZZJ6n2cKr51FonrcrMjm68aS4Lemk+D4sRaHnN+O5BrF10BiSfjumSkvhZ0Uwu/tR35LSmtC1UmVPgRNMwWkSHZjfjEdqueqhYglmB7nHQ8TDWCTb7lJLtTdhx1btg7UWsAuNIhffUpBo+T+3oh8sg8c41WaX5JaNL19UkD2M0qFd8Sayfr0qeGXnrLrKkS0t56ckjui2rTTmUDKFup4CnEtE7fu6nGYeGSoCwGoRlYQD/SU1/GSIWfs8hSpK3KeSZgUQXk14b7dh2LaqrVKGJLja/hFcQCt2gdGD+Ml+iH+Cy0lqj3D32RSarS3k4mJyTKsGnETyXVlCbJtC7kiZ/gZ7i8ChR2hL1qWb7ZInxaHN7WVbsLxZmEIp0Bf+we6YCbg0JrLMoTqXqfx7lb4bGgIRzD4Kz+U9pve9VS4eU4c7JKX6XVLqg56dRO7Kw8MVipjdSANC/f54eQJ+YfB3RYT4eih7PAmHp62d8GiCJABN36B6oiENrnHkBvFu9JPTwo6BStvfP+fZEKFoxaKO3f78thxD7GZdMp0PLwZagS3G6TDAdY1nwSqtQC0G/9GR+VUHkDi2Mz5yxc/r8tfic+7p22WjmOGSge8joCeO7y5NARFillrggokK5I9rjSYy/pnNrfHBbORUL1ZCBf4FrD4=

Lewis Cowles https://play.rust-lang.org/?version=stable&mode=debug&edition=2018&code=fn%20main()%20%7B%0A%20%20%20%20println!(%22Hello%2C%20world!%22)%3B%0A%7Dv (another example) Lewis Cowles I did mistakenly think this was automatic (maybe it used to be)

See Also