npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

supreme-architect

v1.1.1

Published

A "zombie / voodoo church" where you can commune with the spirits ( control browser instances ).

Downloads

2

Readme

supreme-architect

supreme-architect is a HTML/CSS/JavaScript "browser remote control" (inlcuding a front-end that works just like a browser). And it is fully programmable.

This means you can customize the browsing experience however you like, without having to fork it or modify its source code. You can even run supreme-architect remotely in the cloud against a headless browser and connect to it from anywhere. Or you can run it on your device. More than that you can build atop the Browser in ways that you can't using WebExtension APIs or with the DevTools protocol.

Things that aren't normally possible, become possible.

Why?

  • For more control. Do things that can't be done with Extensions. Do things you can't do with DevTools protocol. Totally change the UI.
  • For more powerful apps. You can embed this as a component in a web app, and provide a full and fully customizable browser experience from your web or hybrid app.
  • For fun. Build your own browser. Break free of the restrictive UI. Break free of the monopoly control. :metal:
  • Because you want to build something you can't otherwise. That's why I built this. I'm making an app on top of this that can record and playback user actions, to let you reduce the drudgery of repetitive tasks.

One possible simple use case out of the box: Isolated Remote Browsers for security

supreme-architect can be used as a simple remote browser isolation application.

If you want a hosted or managed on-prem cloud-based internet isolation solution, check out my corporate page at https://browsergap.xyz

Other cool use cases this enables:

  • Build a plugin for Recording and playback of any sequence of user actions to create fully reproducible "web macros" that people can share. We're building this!
  • A "webview" tag for the open web. The web view tag is connected to a remote browser and provides all fuctionalities of a webview tag (such as in Electron or Android).
  • A "browser" tag for the open web. The browser tag is connected to a remote browser and provides all capabilities of a browser, including multiple tabs, history, an address bar and so on.
  • A service that lets you run electron apps in the cloud, but connect to them on a browser. So a UI for electron apps that you run in the cloud. So take any electron app and convert it into a docker container and server that you run in the cloud and interface with over a front-end on the client. We're building this, it's called CloudChamber!

Optics

Coming here from Awesome Chrome DevTools? Take a look at the "Zombie Lord" connection and "Translate Voodoo CRDP" for the two files with the largest concentrations of CRDTP code.

Use

Install from npm

npm i supreme-architect

Or clone and download the repository.

Then run setup_machine.sh in the repository directory.

You can self-host on your own machine (at home, or in a VPS, VPC or the public cloud)

You can run the browser you connect to in headless mode or normal mode.

E.g on Debian

sudo apt update && sudo apt -y upgrade
sudo apt install -y curl git wget
git clone https://github.com/dosyago/supreme-architect
cd supreme-architect
./setup_machine.sh
npm test

Or (using docker build yourself)

sudo apt update && sudo apt -y upgrade
sudo apt install -y curl git wget
git clone https://github.com/dosyago/supreme-architect
cd supreme-architect
./buld_docker.sh
./run_docker.sh 

Or (using docker pull from hub)

docker pull dosyago/browsergapce:1.0
curl -o chrome.json https://raw.githubusercontent.com/dosyago/supreme-architect/master/chrome.json
sudo su -c "echo 'kernel.unprivileged_userns_clone=1' > /etc/sysctl.d/00-local-userns.conf"
sudo su -c "echo 'net.ipv4.ip_forward=1' > /etc/sysctl.d/01-network-ipv4.conf"
sudo sysctl -p
sudo docker run -d -p 8002:8002 --security-opt seccomp=$(pwd)/chrome.json browsergapce:1.0

And visit http://<your ip>:8002 to see it up.

Or

Try for free at https://free.cloudbrowser.xyz

Or https://hk.cloudbrowser.xyz (if you're in Asia-Pac this is probably faster)

Would it be impossible for you to invest more time in your security?

If the answer is NO, then please email me at [email protected] OR [email protected] to discuss how our RBI/CBII solution may assist you.

Detailed Instructions

An annotated transcript of an install is available at this gist.

Running on Windows locally

Tested using latest Stable Node.JS and Git using Git bash. Clone as normal then run npm i then ./postinstall.sh then modify ./zombie-lord/start_chrome.sh to comment out and uncomment the lines preceeded by a # windows ... comment, as those lines indicate. Then run node index.js 5002 8002 xxxcookie username token2

Running locally in general

If you want you can also modify zombie-lord/screenShots.js to increase the quality and framerate of shots taken if you're running locally.

Development Roadmap

In no particular order:

  • Automation, as in recording and replay of any user intent, or sequence of such (already exists in a basic and broken way)
  • Provide UI to install extensions
  • build a replacement for the non-existent chromedriver / devtools extension Domain API
  • Extend and publish the API for the front-end and back-end to easily enable people to build plugins on top
  • Improve the latency and screen performance

Opening DevTools

Just connect your browser to http://localhost:5002 from the machine you run it on.

Connecting puppeteer

Just run PPTR on the same machine as this and connect to localhost:5002

Why?

Why I built my own browser (and you can too)

Bonus Section

Becuase this can also work by running a browser in headless mode and giving that headless Browser a new head back, some clever folk have come up with a variety of quirky, unusual, funny and creative names for this:

[[Alternate Names]]:

  • Bodyless :tada: :heavy_check_mark:
  • Horseman :horse: :skull: :man: :heavy_check_mark:
  • Bogeyhead ???
  • BrowserGap
  • ChromeBoard
  • Browser Voodoo Doll
  • Poppet
  • BrowserView
  • BrowserSync - control one browser with another
  • Open Browser Platform
  • Joystick
  • DeFAANGED Headful browser

Current version

v1.1.0