My little friend, Calcifer, is here to help you navigate the web in a new way. Sometimes, to make things work, you need to tidy up—whether it’s your bed or your code. You clean things up, and suddenly, everything flows better. The interface through which we experience the web should be tidy. But right now, it’s cluttered with browser banners, unnecessary information, ads, and other distractions. This clutter keeps us from experiencing that “flow state” we crave when browsing the World Wide Web. Our little demon friend, Calcifer, wants to help tidy things up and make browsing effortless. Currently, Calcifer dynamically and constantly extracts and ranks all the links on the screen to determine what is truly relevant to us. It acts like a filter, helping you navigate faster and without distractions by simply clicking on buttons.
Setup: Calcifer is a Chrome extension developed and tested on Version 131.0.6778.33 (Official Build) beta (x86_64). It should work across all browsers with WebGPU.
- After cloning the repo: https://github.com/kerosene-vive/Calcifer on your computer, run:
- npm i
- npm run build
- Open Chrome, go to the extensions page, enable developer mode, load unpacked, and load the dist folder just created. The first-time setup takes a bit of time as it downloads the model weights from Hugging Face.
Developing: I initially started developing Calcifer with WebLLM, a high-performance in-browser LLM inference engine. I spent hours—days—trying every possible way to make the official window.ai library work, following every possible lead in the documentation, until I noticed strange behaviour. The API seemed to give seemingly random results, specifically when I ran this command: (await ai.languageModel.capabilities()).available. I kept getting odd results—sometimes "no," sometimes "yes," and occasionally an error, with variations over days or even seconds. I thought the only possible explanation was that this was a signal to check elsewhere.
So, I found this YCombinator thread: https://news.ycombinator.com/item?id=40834600 and this X post: https://x.com/reach_vb/status/1805226216997200145 which talked about Gemini Nano weights being posted on Hugging Face and how to run them in the browser with mediapipe . After really countless attempts, I managed to make them work using an adapter I also found on Hugging Face: https://huggingface.co/wave-on-discord/gemini-nano-adapter. Since I couldn’t add the weights directly into the extension due to size limitations, I created this HF repo: https://huggingface.co/lagunablublu/test_shards, where I split the weights into smaller, more manageable chunks. The extension automatically downloads these at first startup and stores them in the browser cache.
What’s Next:
- I’d like Calcifer to work seamlessly across all web pages, including social media.
- I want to give it the ability to perform Google searches directly within the extension panel and provide clickable search results.
- My ultimate goal is to make Calcifer as fluid, responsive, and immersive as possible, making navigation across the entire World Wide Web faster and easier.
What I Learned: I learned a lot of patience—doing this alone is not easy, and I think it could drive you crazy! Haha. But I had a lot of fun, and it was truly a challenge, especially with my broken computer. I gained knowledge about small language models, ML compilation, and web technologies like WebGPU and WASM. Moreover, I became fascinated with the potential of small language models. It’s exciting to think about how they could lead to the creation of spirits or yokai, which is where the idea of Calcifer originated—autonomous, small, intelligent beings.
Built With
- css
- html
- javascript
- mediapipe
- typescript
- webgpu
Log in or sign up for Devpost to join the conversation.