share / sharedb

Realtime database backend based on Operational Transformation (OT)

Other

6.21k stars 449 forks source link

Browser build for client #499

Open curran opened 3 years ago

curran commented 3 years ago

I'm experimenting with using dependencies from a CDN, and it would be interesting to expose sharedb/lib/client in a browser build with a browser global. That way it would be possible to load the ShareDB client from a CDN, rather than include it in the project bundle.

Would this be of interest to anyone else?

curran commented 3 years ago

FWIW it comes to about 86KB minified, using a Rollup build with Node polyfills

In the ShareDB examples with Browserify, it comes to about 98KB minified.

cd examples/counter/static/dist
uglifyjs --compress --mangle -- bundle.js > min.js

curran commented 3 years ago

To be clear, what I'm proposing is that we introduce a new file in the NPM package for ShareDB (that's not tracked in Git), which is a Rollup-based UMD build of sharedb/lib/client.

curran commented 3 years ago

Managed to get the browser build down to 68KB using Closure compiler.

curran commented 3 years ago

It might make sense for this to even be a downstream package from ShareDB. That would satisfy the need as well.

curran commented 3 years ago

So I got this working. Thinking to publish this on NPM as sharedb-client-browser.

https://github.com/curran/sharedb-client-browser

Thoughts?

curran commented 3 years ago

Got the bundle down to 65kB using a more up to date Node polyfill library.

curran commented 3 years ago

It's working.

https://cdn.jsdelivr.net/npm/sharedb-client-browser@1.0.0/sharedb-client-browser.min.js

curran commented 3 years ago

Turns out such a small bundle was a pipe dream. Closure compiler renamed fields, which broke ShareDB. After switching to "simple" compilation mode, everything actually works and the bundle is 83.6 kB.

curran commented 3 years ago

Closing as this is done, albeit externally to mainline ShareDB.

If there is any interest in including the browser build in mainline ShareDB feel free to reopen!

curran commented 1 year ago

Reopening as this is not really a solved problem.

ShareDB does not provide a build in its NPM distribution that is compatible with widely used tools like Vite, as demonstrated in https://github.com/share/sharedb/pull/598

Ideally ShareDB would provide a build for the client entrypoint that is compatible with Vite and other build systems that do not have built-in support for Node polyfills.

Proposal

Introduce a new asset published to NPM that is a pre-built bundle of the client-side only.

For consumers of ShareDB, instead of saying

import sharedb from 'sharedb/lib/client'

we could say

import sharedb from 'sharedb/lib/client-browser.js'

To produce client-browser.js, the prepublish step of ShareDB itself could include a step that runs sharedb/lib/client through browserify, much like the examples do, which would include the appropriate Node polyfills.

Thoughts?

curran commented 1 year ago

Upgraded https://github.com/vizhub-core/sharedb-client-browser to use Browserify and the latest ShareDB version.