Show HN: I built a free in-browser Llama 3 chatbot powered by WebGPU (github.com)

547 points by abi ↗ HN
I spent the last few days building out a nicer ChatGPT-like interface to use Mistral 7B and Llama 3 fully within a browser (no deps and installs).

I’ve used the WebLLM project by MLC AI for a while to interact with LLMs in the browser when handling sensitive data but I found their UI quite lacking for serious use so I built a much better interface around WebLLM.

I’ve been using it as a therapist and coach. And it’s wonderful knowing that my personal information never leaves my local computer.

Should work on Desktop with Chrome or Edge. Other browsers are adding WebGPU support as well - see the Github for details on how you can get it to work on other browsers.

Note: after you send the first message, the model will be downloaded to your browser cache. That can take a while depending on the model and your internet connection. But on subsequent page loads, the model should be loaded from the IndexedDB cache so it should be much faster.

The project is open source (Apache 2.0) on Github. If you like it, I’d love contributions, particularly around making the first load faster.

Github: https://github.com/abi/secret-llama Demo: https://secretllama.com

149 comments

[ 5.5 ms ] story [ 38.9 ms ] thread
Is this downloading a ~5gb model to my machine and storing it locally for subsequent use?
(comment deleted)
Yes, it only starts the download after you send the first message so visiting the site won’t use up any space.

Approx sizes are listed in the GitHub README.

Models are stored in indexeddb and will be managed by the browser. Might get evicted.

I thought browser tabs only had access to ~400mb

How do you have access to 5gb?

A lot of the more modern options allow for many gigabytes for typical user setups https://developer.mozilla.org/en-US/docs/Web/API/Storage_API....
Very interesting! Thank you so much

I was always under the impression that the max blob size was 400mb and so you couldn't store files any bigger than that. Google gives so many different answers to these questions.

Do you know any other resources I can go more in depth on browser storage limits?

Nice demo! I briefly tried it out and the demo felt much better than the original WebLLM one!

On a side note, i've been trying to do something similar too for similar reasons (privacy).

Based on my recent experience, i find that running LLM directly in the browser with decent UX (e.g. sub 1-2 second response time, no lag, no crashes) is still somewhat impossible given the current state of things. Plus, i think that relying on users' own GPU hardware for UX improvement via WebGPU is not exactly very practical on a large scale (but it is still something!) since not everyone may have access to GPU hardware

But yeah, if there's anything to look forward to in this space, i personally hope to see improved feasibility of running LLMs in browsers

Very cool! I wish there was chat history.

Also if you click the "New Chat" button while an answer is generating I think some of the output gets fed back into the model, it causes some weird output [0] but was kind of cool/fun. Here is a video of it as well [1], I almost think this should be some kind of special mode you can run. I'd be interested to know what the bug causes, is it just the existing output sent as input or a subset of it? It might be fun to watch a chat bot just randomly hallucinate, especially on a local model.

[0] https://cs.joshstrange.com/07kPLPPW

[1] https://cs.joshstrange.com/4sxvt1Mc

EDIT: Looks like calling `engine.resetChat()` while it's generating will do it, but I'm not sure why it errors after a while (maybe runs out of tokens for output? Not sure) but it would be cool to have this run until you stop it, automatically changing every 10-30 seconds or so.

Nice personal hosted image service!
I’m just using CleanShotX [0] which is an awesome image annotation tool for macOS. It’s way better than the built-in tool that macOS comes with. You can also record as a gif for video which is nice, I use it often to make guides for my day job and my business.

[0] https://cleanshot.com

Thanks for the bug report. Yeah, it’s a bug with not resetting the state properly when new chat is clicked. Will fix tomorrow.

Chat history shouldn’t be hard to add with local storage and Indexed DB.

Could we use an already downloaded .gguf file?
I'm just seeing ERR_SSL_VERSION_OR_CIPHER_MISMATCH at https://secretllama.com/ and at http://secretllama.com/ I see "secretllama.com has been registered at Porkbun but the owner has not put up a site yet. Visit again soon to see what amazing website they decide to build."
Just bought the domain a couple of hours ago so DNS might not have propagated. Try back tomorrow or download and install it from GitHub (it’s just 2 steps)
It's truly amazing how quickly my browser loads 0.6GB of data. I remember when downloading a 1MB file involved phoning up a sysop in advance and leaving the modem on all night. We've come so far.
97MB for the Worms 3 demo felt like an eternity.

So what games are in this LLM? Can it do solitaire yet?

It generates things that you get to look up citations for. It doesn't care if its output converges, it does what it wants differently every time.
> It generates things that you get to look up citations for.

Why would you use it for that? Use a search engine.

LLMs are substitute for talking to people. Use them for things you would ask someone else about, and then not follow up with searching for references.

It can probably role-play.
GPT-3.5 is pretty good at fabricating text adventures, I haven't tried any of the smaller models with that yet.
When I think about numbers like that it just seems (to me, and wrongly) like general progress that's not so crazy - the thought that really makes the speed of progress stand out to me is remembering when loading a single image - photo sized but not crazily high resolution - over dial-up was slow enough that you'd gradually see the image loading from top to bottom, and could see it gradually getting taller as more lines of pixels were downloaded and shown below the already loaded part. Contrasting that memory against the ability to now watch videos with much higher resolution per frame than those images were 30 years ago is what really makes me go "wow".

For anyone not old enough to remember, here's an example on YouTube (and a faster loading time than I remember often being the case!): https://youtube.com/watch?v=ra0EG9lbP7Y

You could more or less fit the full model on a single CD (or a DVD for the larger model sizes) but of course forget about trying to do inference for it on period hardware, it would be unusably slow.
This is awesome. I have been using ChatGPT4 for almost a year and haven't really experimented with locally running LLMs because I assumed that the processing time would take too long per token. This demo has shown me that my RTX 2080 running Llama 3 can compete with ChatGPT4 for a lot of my prompts.

This has sparked a curiosity in me to play with more LLms locally, thank you!

My pixel 6 was able to run tinyllama and answer questions with alarming accuracy. I'm honestly blown away.
This is amazing. Thanks both for sharing your stories. Made my day.
Uh oh, I had that same moment a bit over a year ago with MLC's old WebLLM. Take a deep breath before you jump into this rabbit hole because once you're in there's no escape :)

New models just keep rolling in day after day on r/locallama, tunes for this or that, new prompt formats, new quantization types, people doing all kinds of tests and analyses, new arxiv papers on some breakthrough and llama.cpp implementing it 3 days later. Every few weeks a new base model drops from somebody. So many things to try that nobody has tried before. It's genuinely like crack.

Amazing! It's surprisingly fast to load and run given the size of the downloaded models.

Do you think it would be feasible to extend it to support web browsing?

I'd like to help if you could give some pointers on how to extend it.

When asked about web browsing, the bot said it could fetch web pages but then obviously didn't work when asked to summarize a web page.

[EDIT] The Llama 3 model was able to summarize web pages!

I commented too soon. The TinyLlama model didn't seem to be able to summarize web pages but Llama 3 worked perfectly! Very cool.
Are you sure it is not hallucinating? Most likely these models don't have an access to the Internet.

edit: typo

Yes, I got way too excited and comment trigger happy. It does not appear to browse the web and was just hallucinating. The hallucinations were surprisingly convincing for a couple of the pages I tested. But on examining the network requests, no fetches were made to the pages. Llama 3 was just a lot better at hallucinating convincing results than Tiny Llama.
Looks like all the heavy lifting is being done by webllm [0]. What we have here is basically one of the demos from that.

[0] https://webllm.mlc.ai/.

> I’ve used the WebLLM project by MLC AI for a while to interact with LLMs in the browser when handling sensitive data but I found their UI quite lacking for serious use so I built a much better interface around WebLLM.
IMO eventually users should be able to advertise what embedding models they have so we don't redundantly redownload.
That's not possible with current web tech, is it?

Different webapps can't share common dependencies stored in localstorage afaik.

This need wasn’t super prevalent in the pre LLM days. It’s rare to have a multi-GB blob that should be commonly used across sites.
Well, it should be possible to just drag and drop a file/folder
Who knows. Maybe the browser would be a more prevalent gaming platform if it could be assumed that loading a multi gigabyte game engine is no big deal, because everyone had one already cached.

A lot of unity games could easily be web games, but aren't because of many roadblocks. I believe this is one of them.

It was a real need given how almost all sites use large JavaScript deps. However, any hopes of sharing those were destroyed by adtech people timing resource downloads to track people.
Lots and lots of websites still use Google and other CDNs for JS deps, fonts, etc.
They are cached independently these days to avoid privacy issues. So if websites A and B both use the same JavaScript dependency from a public CDN and you visit them both, you will download the JavaScript dependency twice, even if you have it cached from your visit to the first website.
It can probably be done with a browser extension. It can definitely be done by the browsers themselves. Eventually it will probably be done by the operating system, which the browsers will then expose.
It is, but only within the same origin, which already enables users to not re-download jquery.js or Google Fonts if they previously visited another website that downloaded the same file from the same (usually cross-) origin.
Not default web tech. It can be done with IPFS via IPFS Companion browser extension - https://chromewebstore.google.com/detail/ipfs-companion/nibj... or browsers with native IPFS client support like Brave or Opera.

Fetching these models over IPFS would locally cache them and dedupe calls for them by IPFS content ids - https://docs.ipfs.tech/concepts/content-addressing/#:~:text=... which functions similar to a file hash (not an exact parallel, since CIDs represent files that are broken up into chunks).

This would help with object DL deduplication if everyone is using the same models & would also help to decrease centralized data egress costs since with sufficient usage you would be DLing these models from other peers that are running IPFS nodes and holding onto the models.

Last time I tried IPFS it was really slow, if you have to run a node to serve files then direct downloads are much better.

A simple extension would do, that manages models and exposes an interface to window so webapps can call it.

Like window.llm.generate({model,prompt})

Phi 1.5 isn't quite there is it? Caught it having some inner dialog.

What does that mean? Instruct: I'm sorry, but I'm not sure what you mean by "wutt". Output: Oh, I'm sorry. I meant "what does that mean?" Instruct: No problem, "wutt" means "that doesn't make any sense". Output: Ah, I see. Thank you for clarifying! Instruct: You're welcome! If you have any more questions, feel free to ask. Instruct: I'm glad I could help! Instruct: I hope you continue to enjoy learning about language arts. Instruct: You're doing a great job! Keep up the good work! Instruct: Have a fantastic day! Instruct: Goodbye! Instruct: Goodbye!

I've seen this with Phi 1.5B a lot. Try TinyLlama for a 1.1B model or Gemma for 2B. The latter is not available on OP's website yet but maybe in the future.
That boy needs therapy.
Purely psychosomatic
But surely, expulsion is not the answer!
Where in the heck did you all discover this song? It's never been on the radio I assume. I only found it because it cropped up in yahoo messenger/launchcast at some point - never seen it anywhere else.
It was big on YTMND back in the day
It's what you get when you leave the autogenerated Youtube mixes running for far too long. Far too long...
Sadly my answer is: because I’m old. That album was a big deal back in the day.
That seems almost like the instruction template is wrong.
I wasn't able to get much use from Phi 1.5 (except for leaking Microsoft's proprietary training data).

Phi 3 is great though.

(comment deleted)
On Firefox Nightly on my Steam Deck it "cannot find WebGPU in the environment".
Last I checked ff explicitly does not support webgpu, webhid, webusb, etc.

Apparently nightly is supposed to support it: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Exp...

So here's a howler to the new Mozilla CEO and FF teams who're looking for ways to save their org:

- release WebGPU support everywhere, also embed llama.cpp or something similar for non GPU users

- add UI for easy model downloading and sharing among sites

- write the LLM browser API that enables easy access and sets the standard

- add security: "this website wants to use local LLM. Allow?"

Hmm but what about another mobile phone OS instead? Or a vpn service? Surely people don't care about browser features.
There’s also the little issue of firefox not supporting HDR videos which with more and more OLED/miniLED monitors out there is a major drawback. I love FF and i daily drive it, but there are some glaring gaps in the feature set between chromium and ff.
I had the same issue on my iPhone! You can (temporarily) enable WebGPU by going to Settings > Safari > Advanced > Experimental features (I don't know what it's called in English, but it's the bottom one).
Tried this in Chrome under Windows, it does work but does not seem to use the RTX4060, only the integrated Iris Xe. Is this a bug or intentional?
I think neither. You need to configure windows to use the RTX with Chrome. Maybe something like in windows graphics settings, setting Chrome to “High performance”. A quick web search for "force Chrome to use dedicated GPU" should give you all the steps you need.
When you use the GPU in the browser, you can only request the high performance GPU. It is up to the OS to grant it or not.

So maybe the author forgot to include the high performance request, or your OS does not give the high performance GPU by default (as it might be in eco mode). This behavior can be changed in OS settings.

This is very cool, it's something I wish existed since Llama came out, having to install Ollama + Cuda to get locally working LLM didn't felt right to me when there's all what's needed in the browser. Llamafile solves the first half of the problem, but you still need to install Cuda/ROCm for it to work with GPU acceleration. WebGPU is the way to go if we want to put AI on consumer hardware and break the oligopoly, I just wished it became more broadly available (on Linux, no browser supports it yet)
Tested on Ubuntu 22.04 with Chrome, sure enough, "Could not load the model because Error: Cannot find adapter that matches the request".

It really is too bad WebGPU isn't supported on Linux, I mean, that's a no-brainer right there.

Works for me.

WebGPU support is behind a couple flags on Linux: https://github.com/gpuweb/gpuweb/wiki/Implementation-Status

Awesome, thanks for pointing me here.

I tested with the flags and adding the --enable-Vulkan switch, but to no avail. But I have a somewhat non-standard setup both software and hardware, so I'm not terribly surprised. (Kubuntu 22.04 on an MSI laptop with an nvidia 3060, using proprietary non-free/blob driver 535.)

I will be playing with webGPU in the coming weeks on a number of platforms, seems like a no-brainer for the current state of AI stuff.

I get the same thing on Chrome and my last generation Intel iMac.
Likewise (same error) with Chrome on Windows.

Currently running Ollama / Open WebUI and finding lama3:8B quite useful for writing snippets of powershell, javascript, golang etc.

I've managed to avoid ollama and just toyed with lmstudio. It's non-free software, but extremely easy to get into, uses llama.cpp under the hood, cross-platform, yada yada. There's https://jan.ai/docs as well, is AGPL3, and promises inference as well as training - doubtless many other similar offerings.

I'm wary of any 'web' prefix on what could / should otherwise be desktop applications, mostly due to doubts about browser security.

> having to install Ollama + Cuda to get locally working LLM didn't felt right to me when there's all what's needed in the browser

Was there something specifically about the install that didn't feel right? I ask because ollama is just a thin go wrapper around llama.cpp (its actually starting a modified version of the llama.cpp server in the background, not even going through the go ffi, likely for perf reasons). In that that sense, you could just install the CUDA toolkit via your package manager and calling `make LLAMA_CUDA=1; ./server` from the llama.cpp repo root to get effectively the same thing in two simple steps with no extra overhead.

I'm never gonna have my non-tech friend do any of this when they can just go to chat.openai.com and call it a day.

Most people value convenience at the expense of almost everything else when it comes to technology.

> I'm never gonna have my non-tech friend do any of this

Who was making that assertion? I certainly wasn't.

In the same way I am never going to tell my non-engineer friends to build their own todo app instead of just using something like Todoist. But if they told me they cared about data privacy/security, I'd walk them through the steps if they cared to hear them.

> Who was making that assertion? I certainly wasn't.

But you were responding to my comment, and that was the implied part in it (which I later clarified to answer your question).

> In the same way I am never going to tell my non-engineer friends to build their own todo app instead of just using something like Todoist. But if they told me they cared about data privacy/security, I'd walk them through the steps if they cared to hear them.

Fortunately for most apps there's a middle ground between “use a spyware” and “build your own”, and that's exactly why this tool is much needed for LLM in my opinion.

> Fortunately for most apps there's a middle ground between “use a spyware” and “build your own”, and that's exactly why this tool is much needed for LLM in my opinion.

Sure I understand the motivation I think, the big tradeoff is performance. If your original commentary about people privileging convenience holds true across the end-to-end user experience here, I would say that single digit tokens per second rates probably qualify as inconvenient for many folks and thus cannibalize whatever ease-of-setup value you get at the outset.

There's a reason CUDA/ROCm is needed for the acceleration, there's a ton of work put into optimization via custom kernels to get the palatable throughput/latency consumers are used to when using frontier model APIs (or GPU-accelerated local stacks).

This is amazing! I always wanted something like this, thank you so much!
Very interesting! I would be quite interested to see this implemented as some sort of API for browser chatbots or possibly even local AI powered web games? If you don't know what Ollama is I suggest checking it out. Also I think adding the phi3 model to this would be a good idea.
Question - Do I compromise on quality on answers if I use models using WebLLM (like this) compare to using them on system console.
What therapy prompts have you found useful?
I usually just go with "and how does that make you feel?"
Yasssssss! Thank you.

This is the future. I am predicting Apple will make progress on groq like chipsets built in to their newer devices for hyper fast inference.

LLMs leave a lot to be desired but since they are trained on all publicly available human knowledge they know something no about everything.

My life has been better since I’ve been able to ask all sorts of adhoc questions about “is this healthy? Why healthy?” And it gives me pointers where to look into.

They are not “trained on all publicly available human knowledge”. Go look at the training data sets used. Most human knowledge that has been digitized is not publicly available (e.g., Google Books). These models are not able to get to data sets behind paywalls (e.g., scientific journals).

It will be a huge step forward for humanity when we can run algorithms across all human knowledge. We are far from that.

There is a rumor that OpenAI might've used libgen in their training data.
Someone will. The potential gains are too high to ignore it.
We are talking about trillions of tokens.

I’m sure the big players like Google, Meta, OpenAI have used anything and everything they can get their hands on.

Libgen is a wonder of the internet. I’m glad it exists.

I am also glad that libgen exists. Liberating human knowledge from copyright will improve humanity overall.

But I don’t understand how you can be sure that the big players are using it as a training corpus. Such an effort of questionable legality would be a significant investment of resources. Certainly as the computronium gets cheaper and techniques evolve, bringing it into reach of entities that don’t answer to shareholders and investors, it will happen. What makes you sure that publicly owned companies or OpenAI are training on libgen?

I actually think Apple has been putting neural engines in everything and might be training something like Llama3 for a very long time. Their conversational Siri is probably being neglected on purpose to replace it . They have released papers on faster inference and released their own models. I think their new Siri will largely use on device inference but with a very different LLM.

Even llama.cpp is performant already on macOS.

Groq is not general purpose enough, you'd be stuck with a specific model on your chip.
I'm not sure what you mean. The GroqChip is general purpose numerical compute hardware. It has been used for LLMs, and it has also been used for drug discovery and fusion research (https://www.alcf.anl.gov/news/accelerating-ai-inference-high...).

[I work for Groq.]

And just in case it's not clear: I'm saying Groq can be used for arbitrary AI inference workloads, and we aim to be the fastest for all of them. We're not tuned to any specific model.