I love finding interesting widgets and components on the web. I could screenshot them, or view the source and spend an afternoon failing to make them work anywhere else. I wanted a third option.
That's what Scavenger is. Four single-file tools, local-first, no deps, no frameworks.
You open a page, run the bookmarklet, and harvest whatever you want straight off the live DOM. Paste it onto the patchbay canvas, wire the pieces into something new, and export a single HTML file that works anywhere.
What I'm happiest about is the harvesting. It lifts a rendered component off a live page and reconstructs it as an independent web component - resolving the styles the browser actually applied, and carrying the cascade, responsive units, variables, pseudo-elements, fonts, assets, form state and layout behavior with it.
The patchbay is where harvested pieces get wired together. It's one HTML file whose entire state lives in the DOM - the wiring is just attributes. Save and you get a quine: editor and work in one file, reopening exactly where you left it. Publish and you get the document without the editor. This means that anything you build inside it is a portable environment.
Any of it can also be live. A small local node server reads values - or whole components - off their source pages on a schedule and feeds them in as named channels, so a harvested widget can keep updating from where you found it, or re-harvest itself and morph in place without losing its wiring.
One thing worth stating: a harvest has its scripts stripped, network paths removed - so a harvested component can't phone home, but also loses some of the logic. Authored components and the mutator node are the opposite: they keep their <script> so you can build stuff using the compiler tool.
I love finding interesting widgets and components on the web. I could screenshot them, or view the source and spend an afternoon failing to make them work anywhere else. I wanted a third option.
That's what Scavenger is. Four single-file tools, local-first, no deps, no frameworks.
You open a page, run the bookmarklet, and harvest whatever you want straight off the live DOM. Paste it onto the patchbay canvas, wire the pieces into something new, and export a single HTML file that works anywhere.
What I'm happiest about is the harvesting. It lifts a rendered component off a live page and reconstructs it as an independent web component - resolving the styles the browser actually applied, and carrying the cascade, responsive units, variables, pseudo-elements, fonts, assets, form state and layout behavior with it.
The patchbay is where harvested pieces get wired together. It's one HTML file whose entire state lives in the DOM - the wiring is just attributes. Save and you get a quine: editor and work in one file, reopening exactly where you left it. Publish and you get the document without the editor. This means that anything you build inside it is a portable environment.
Any of it can also be live. A small local node server reads values - or whole components - off their source pages on a schedule and feeds them in as named channels, so a harvested widget can keep updating from where you found it, or re-harvest itself and morph in place without losing its wiring.
One thing worth stating: a harvest has its scripts stripped, network paths removed - so a harvested component can't phone home, but also loses some of the logic. Authored components and the mutator node are the opposite: they keep their <script> so you can build stuff using the compiler tool.
Happy to go deeper into any part of it!