ajur58

ajur58

Hi everyone, I’m new to Elixir & Phoenix and loved the experience so far. However, when looking into Phoenix it seems like the standard way to work with buttons is <%= button "Click me" %> , which creates a tag, and adds data- attributes. Then there’s an onClick listener in app.js that creates a form, injects the attributes and submits it.

I must say I’m somewhat disappointed that because of this the page doesn’t work without Javascript + I was surprised that app.js weighs 632kB uncompressed.

Is this a common problem that all Phoenix apps have? Or do people use something else? Or maybe I’m just missing something?

Showing Posts 1 to 2

LostKobrakai

LostKobrakai

You could not use buttons outside of forms. Then you don’t need the JS and your website will work without JS. Also phoenix_html.js, which defines what you described, is tiny (<3kB uncompressed): phoenix_html/priv/static/phoenix_html.js at main · phoenixframework/phoenix_html · GitHub

phoenix.js is much larger because it’s powering the client side part of phoenix channels. If you’re not using channels on the client you should be fine to exclude phoenix.js.

ajur58

ajur58 OP

Thanks for your answer and pointing me to phoenix_html.js!

I understand that it would not work outside of forms, my suggestion would rather be to wrap the button with a form right in the template as HTML, not with JS after page load. Is there a reason why Phoenix decided to do it with JS?

This is the way some newer JS frameworks like Remix do it, getting the benefits of a progressive UX - as in everything works without JS from the first load, then it gets enhanced.

It might not be a big deal, but I believe these things could matter to other people like me who came to Phoenix after getting tired of the JS drama. T

— All posts loaded —

Where Next? Top

Trending in Questions Top

stjefim
Hello! Suppose you are building workflow (order / task / payment) processing system with the following requirements: Each workflow con...
New
jonnycharles
I’m in search of an Elixir library that offers PDF generation capabilities similar to Ruby’s Prawn. While there have been discussions abo...
New
spammy
I’m looking to build a personal workflow to quickly deploy web applications written in elixir/phoenix, for local consumption (ie not on t...
New
Blokh
Hey guys, I’ve got a huge CSV ( around 10 GB ) that needs to be processed hourly Do you guys have any suggestions what is the best prac...
New
dli
Before I dive in myself, did anyone successfully sprinkle Hologram into their existing LiveView app? Looking for hints regarding: Addi...
New
roeland
Kia ora, We have been using elixir-google-api to connect to Google Drive. However, with the updates to Tesla due to CVEs this is now bro...
New
subsaharancoder
I’ve followed the Phoenix LiveView file upload code here Uploads — Phoenix LiveView v1.0.0-rc.7 and so far everything works just fine wit...
New

Other Trending Topics Top

JesseHerrick
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
New
jimsynz
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
mcass19
ExRatatui lets you cook up rich terminal UIs in Elixir, powered by Rust’s ratatui via Rustler NIFs. Build interactive terminal applicatio...
New
netoum
Corex is an accessible, unstyled UI component library for Phoenix that integrates Zag.js state machines using Vanilla JavaScript and Live...
New
Damirados
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge &amp; Solve. They are GUI (Emerge) and State management (S...
New
ausimian
Emily is an Elixir library that runs Nx computations on Apple’s MLX. Install it as the default Nx backend and Nx, defn, Axon, Nx.Serving,...
New

Latest on Elixir Forum

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews