<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf" -->

---
title: Elixir in the Browser: Bart Blast on Hologram | daily.dev
description: A podcast conversation with Bart Blast, creator of Hologram, a full-stack Elixir web framework that compiles Elixir to JavaScript so it runs directly in the...
canonical: https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: Elixir in the Browser: Bart Blast on Hologram | daily.dev
og:description: A podcast conversation with Bart Blast, creator of Hologram, a full-stack Elixir web framework that compiles Elixir to JavaScript so it runs directly in the...
og:url: https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf
og:image: https://api.daily.dev/og/posts/pICmuJsYf.png
og:image:alt: Elixir in the Browser: Bart Blast on Hologram
og:image:width: 1200
og:image:height: 630
og:locale: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Elixir in the Browser: Bart Blast on Hologram

**[ElixirStatus](https://daily.dev/sources/elixirstatus)** · 45 min read · 0 upvotes · 0 comments

## Summary

A podcast conversation with Bart Blast, creator of Hologram, a full-stack Elixir web framework that compiles Elixir to JavaScript so it runs directly in the browser rather than keeping UI state on the server like Phoenix LiveView. Blast explains the motivation (avoiding a two-language front end/back end split and eliminating server round-trip latency), the architecture (a compiler that lowers Elixir into an intermediate representation and rebuilds BEAM runtime guarantees like pattern matching and immutability in JS), why JS was chosen over WASM (bundle size: ~89KB compressed vs 5MB+ for a compiled BEAM-to-WASM approach), how call-graph-based tree shaking keeps bundles small, comparisons with Gleam's Lustre framework, current limitations (young project, incomplete standard library coverage, sparse tooling), and future plans for a local-first autosync data store and eventually porting the actor model to web workers for mobile/desktop targets.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://www.youtube.com/watch?v=BOsSI7WlhdI>

## Questions this post answers

### Why does Hologram compile Elixir to JavaScript instead of using WebAssembly?

Hologram targets JavaScript rather than WebAssembly primarily because of bundle size: compiling the BEAM virtual machine to WASM would require shipping around 5 megabytes or more of compressed code before any app logic runs, whereas Hologram's entire runtime and framework is about 89 kilobytes compressed, over 50 times smaller. JavaScript also avoids the DOM-access serialization tax at the JS/WASM boundary and lets Hologram reuse native browser APIs directly.

_Developers weighing Elixir-in-the-browser tradeoffs can track frameworks like Hologram on daily.dev._

### How does Hologram decide which Elixir code actually gets shipped to the browser?

Hologram builds a call graph over the entire project, including dependencies and the Elixir standard library, treating actions, templates, components, and pages as entry points. It traces everything reachable from those entry points and tree-shakes the rest, so each page only ships the code it needs, which is a major reason the runtime stays around 89 kilobytes compressed.

_Anyone comparing bundle strategies across frontend frameworks can follow this kind of architecture deep dive on daily.dev._

### What is the key architectural difference between Hologram and Phoenix LiveView for handling UI state?

Hologram keeps UI state in the browser next to the DOM, so interactions run synchronously on the client without a server round trip, while LiveView keeps UI state on the server and streams diffs over a socket, which introduces latency bounded by the speed of light and makes state fragile to dropped connections or deploys. LiveView still wins for keeping proprietary logic private, since Hologram's client-run code is inherently public.

_Teams deciding between server-held and client-held UI state can weigh these Elixir framework tradeoffs on daily.dev._

## Similar posts on daily.dev

- [Elixir in the Browser: Bart Blast on Hologram - BEAM There, Done That](https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram---beam-there-done-that-helhqnel9) · Awesome Elixir · 6 upvotes · 0 comments
- [ElixirConf EU - Learning Resources / Talks - Elixir Programming Language Forum](https://daily.dev/posts/elixirconf-eu---learning-resources-talks---elixir-programming-language-forum-x7olbdmgj) · Elixir Forum · 0 upvotes · 0 comments
- [Curiosum becomes main sponsor of Hologram](https://daily.dev/posts/curiosum-becomes-main-sponsor-of-hologram-epz5brxjh) · Curiosum · 1 upvotes · 0 comments
- [Hologram Works. Sponsor What Comes Next.](https://daily.dev/posts/hologram-works-sponsor-what-comes-next--xavht3p32) · Hacker News · 0 upvotes · 0 comments

---

Tags: [#elixir](https://daily.dev/tags/elixir), [#webassembly](https://daily.dev/tags/webassembly), [#liveview](https://daily.dev/tags/liveview), [#local-first](https://daily.dev/tags/local-first)

[View this post on daily.dev](https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@type":"TechArticle","headline":"Elixir in the Browser: Bart Blast on Hologram","url":"https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf"},"datePublished":"2026-08-17T20:13:53.116Z","dateModified":"2026-08-17T20:14:23.642Z","description":"A podcast conversation with Bart Blast, creator of Hologram, a full-stack Elixir web framework that compiles Elixir to JavaScript so it runs directly in the...","image":"https://i.ytimg.com/vi/BOsSI7WlhdI/sddefault.jpg","thumbnailUrl":"https://i.ytimg.com/vi/BOsSI7WlhdI/sddefault.jpg","isAccessibleForFree":true,"articleSection":"ElixirStatus","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"ElixirStatus","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/22e4640538124187827caf8cc8e39190","url":"https://daily.dev/sources/elixirstatus"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"elixir,webassembly,liveview,local-first","timeRequired":"PT45M","video":{"@type":"VideoObject","name":"Elixir in the Browser: Bart Blast on Hologram","description":"A podcast conversation with Bart Blast, creator of Hologram, a full-stack Elixir web framework that compiles Elixir to JavaScript so it runs directly in the...","thumbnailUrl":"https://i.ytimg.com/vi/BOsSI7WlhdI/sddefault.jpg","uploadDate":"2026-08-17T20:13:53.116Z","duration":"PT45M","url":"https://api.daily.dev/r/pICmuJsYf","embedUrl":"https://www.youtube.com/embed/BOsSI7WlhdI"}}
{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"ElixirStatus","item":"https://daily.dev/sources/elixirstatus"},{"@type":"ListItem","position":3,"name":"Elixir in the Browser: Bart Blast on Hologram"}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/elixir-in-the-browser-bart-blast-on-hologram-picmujsyf#faq","mainEntity":[{"@type":"Question","name":"Why does Hologram compile Elixir to JavaScript instead of using WebAssembly?","acceptedAnswer":{"@type":"Answer","text":"Hologram targets JavaScript rather than WebAssembly primarily because of bundle size: compiling the BEAM virtual machine to WASM would require shipping around 5 megabytes or more of compressed code before any app logic runs, whereas Hologram's entire runtime and framework is about 89 kilobytes compressed, over 50 times smaller. JavaScript also avoids the DOM-access serialization tax at the JS/WASM boundary and lets Hologram reuse native browser APIs directly. Developers weighing Elixir-in-the-browser tradeoffs can track frameworks like Hologram on daily.dev."}},{"@type":"Question","name":"How does Hologram decide which Elixir code actually gets shipped to the browser?","acceptedAnswer":{"@type":"Answer","text":"Hologram builds a call graph over the entire project, including dependencies and the Elixir standard library, treating actions, templates, components, and pages as entry points. It traces everything reachable from those entry points and tree-shakes the rest, so each page only ships the code it needs, which is a major reason the runtime stays around 89 kilobytes compressed. Anyone comparing bundle strategies across frontend frameworks can follow this kind of architecture deep dive on daily.dev."}},{"@type":"Question","name":"What is the key architectural difference between Hologram and Phoenix LiveView for handling UI state?","acceptedAnswer":{"@type":"Answer","text":"Hologram keeps UI state in the browser next to the DOM, so interactions run synchronously on the client without a server round trip, while LiveView keeps UI state on the server and streams diffs over a socket, which introduces latency bounded by the speed of light and makes state fragile to dropped connections or deploys. LiveView still wins for keeping proprietary logic private, since Hologram's client-run code is inherently public. Teams deciding between server-held and client-held UI state can weigh these Elixir framework tradeoffs on daily.dev."}}]}
```

