err0r500

err0r500

How to handle forms with lots of assoc

Hi,
I recently hit a performance issue with a liveview form.

The structure the form edits has lots of association handled dynamically using cast_assoc.
Everything works fine for ~70% of the cases (with just a few assocs), but the 30 remaining percents can have more 100, 200 assocs and the users struggle a lot. In this kind of cases, websocket frames can be 30, 40 KB on each validation.

Just to give a feel of what the form does (and simplify things), let’s imagine it allows to edit staff in a movie :

movie (with a few specific fields, like title, length...)
  -> has many professions (10+, must validate uniqueness in movie and not empty, with a few specific fields) 
       -> has many people (100+, must validate uniqueness in profression and not empty, with a few specific fields)

people are managed somewhere else, i just create a drop down so they can pick a person and add a few metadata for this peculiar profession 

To stay in the example, most of my users manage indie movies with less than 40 people and everything works well, the issue are the blockbusters (and the UI should be able to handle both, so keep everything in a single page without modals or tabs or navigation because for most of my users the form is not that big. )

Do you have any advices about how to handle this ?
Best,
Matthieu

Marked As Solved

err0r500

err0r500

I got some good results by splitting the form into several smaller ones with a dedicated changeset for each one. this led to a notable improvement about what the client sends to the server.
I then realized that on the server response there was a big select that was sent back each time (and for each element of the form) so I encapsulated it in a livecomponent that gets its options once then renders them only for edition.
for saving I merge all forms .params (it seems to work fine) and apply that to the global changeset.
the result is much more efficient (but I had to change a bit the layout and the UX to achieve that)

Thanks for your help !

Also Liked

LostKobrakai

LostKobrakai

I’d start by evaluating if all that data needs to be handled through one huge form. I’d argue nobody wants to scrolls through a list of 200 entries editing all of them at once. They rather scroll hrough a list of 200 entries, and on some click an edit button to make some targeted small edits.

If you still want to stick to that large a form check out the RC for LV 1.1, which has optimizations for for comprehentions as used by inputs_for.

LostKobrakai

LostKobrakai

That’s to me further insight to make this a static list with means of adding, sorting removing individual items with individual forms and actions handling instead of craming it all into a shared parent form.

Those are used to determine which inputs have been “touched” by a user to hide errors for not yet touched inputs.

Where Next?

Popular in Questions Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
Harrisonl
We have an ECS cluster with 4 services, where each task joins a single cluster, via discovery ECS discovery service. Currently when I de...
New
Tee
can someone please explain to me how Enum.reduce works with maps
New
qwerescape
Is there a way to get the call stack or stack trace at any point in the code? Not from exceptions, but an expression that returns how the...
New
mgjohns61585
Could someone help me? I’m making my first elixir program, number guessing game. I can’t figure out how to convert the user’s guess from ...
New
ycv005
I have followed this StackOverflow post to install the specific version of Erlang. And When I am running mix ecto.setup then getting fol...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New
srinivasu
How to handle excepions in elixir? Suppose i have A, B, C ,D, E modules. and each module has get() function. A.get() method will call t...
New
yawaramin
In the Dialyzer docs ( dialyzer — OTP 29.0.2 (dialyzer 6.0.1) ), there is a way to turn off a specific warning for a function: -dialyzer...
New
vonH
In asking this question I am more interested about the expressiveness of the language itself and less concerned about the availability of...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
hariharasudhan94
lets say i have a sample like a = 20; b = 10; if (a > b) do {:ok, "a"} end if (a < b) do {:ok, b} end if (a == b) do {:ok, "equa...
New
marius95
Hello everyone, I try to use an Javascript Event Handler in my root.html.leex file. Therefore I created a function in the app.js file: ...
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
AngeloChecked
What learn first? Rust or Elixir Hi Elixir community! I’m here because i want learn a new language. I’m a junior developer and mainly i ...
New
AstonJ
Please see the new poll here: Which code editor or IDE do you use? (Poll) (2022 Edition) It’s been a while since we first asked this, I...
208 31265 143
New
vonH
When I run the Plug and I recompile I wind up having to use Ctrl C to quit iex and start again. Witht the help of rlwrap I can use the cu...
New
grych
Hi folks, Few months ago I have announced the proof-of-concept of the library to manipulate the browsers DOM objects directly from Elixi...
639 52673 488
New
ashish173
I am using Ecto timestamps with postgres, I can see the timestamps() use the :naive_dateime but for my use case I wanted to store the ti...
New
lanycrost
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
New

Latest on Elixir Forum

Elixir Forum

We're in Beta

About us Mission Statement