<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="101159" data-post-id="101159">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tmbb" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tmbb
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="dgmcguire" data-post="71" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/48/12192_2.png" class="avatar"> dgmcguire:</div>
<blockquote>
<p>I realize texas hasn’t been a target for you so feel free to ignore my questions that are very texas specific</p>
</blockquote>
</aside>
<p>On the contrary. I believe I’ve been looking at server-side VDOM diffing since Drab.Live came out and (through talking to <a class="mention" href="/u/overminddl1" rel="nofollow">@OvermindDL1</a>) I understood that controlling a dynamic UI through the server was viable.</p>
<p>I got pretty excited with the first texas announcement, and then the excitement died out when I understood that texas seemed to depend on parsing HTML strings with Floki (wtf?!).</p>
<p>I’ve never talked to you directly because I’ve been busy with other things, but I’ve been waiting for something faster to come out (parsing HTML at runtime is a big no for me)</p>
<aside class="quote no-group" data-username="dgmcguire" data-post="71" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/48/12192_2.png" class="avatar"> dgmcguire:</div>
<blockquote>
<p>Right now I’m really tempted to avoid V-DOM diffing (because of the relative high expense of tree diffing) and just diff the dynamic data instead</p>
</blockquote>
</aside>
<p>If you use smart heuristics (like react does), you can diff a tree in linear time on the number of nodes.</p>
<p>This requires storing the previous tree in memoy and comparing it with the new one though, which costs memory. By diffing the dynamic data directly, you save a lot of memory.</p>
<p>If you restrict the data to a sensible datatype, auch as a map, you can diff it using already available algorithms, which are linear on the size of the map or list. Then, you can implement something like a mutation watcher, in which you build a dependency graph between the raw data and the VDOM and update only the parts that depend on data that has changed.</p>
<p>The Javascript framework VueJS does some clever things (which I don’t understand) with mutation watchers and dependency graphs, and as a result is both fast and intuitive.</p>
<p><a class="mention" href="/u/overminddl1" rel="nofollow">@OvermindDL1</a> has a client-side framework written in OCaml that compiles to Javascript, which he claims to be very fast.</p>
<p>I think Drab.Live does something like that (and <a class="mention" href="/u/grych" rel="nofollow">@grych</a> is the correct person to explain it to you).</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101159" data-batch-url="/posts/batch_likers">
                        3
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/72">Post #71</a>
	                </div>
	            </div>
              <div id="likers-container-101159" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101159"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #71"></div>
  </section>
</div>
    <div class="postbit" id="101160" data-post-id="101160">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="dgmcguire" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/120/12192_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  dgmcguire
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="72" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/t/77aa72/48.png" class="avatar"> tmbb:</div>
<blockquote>
<p>I got pretty excited with the first texas announcement, and then the excitement died out when I understood that texas seemed to depend on parsing HTML strings with Floki (wtf?!).</p>
</blockquote>
</aside>
<p>haha, that’s merely a means to an end - I wanted to make something work before I made it work well - I’ve been doing a lot of thinking about how to optimize and do more at compile time which is largely the reason I’ve been following your posts so closely.  My initial impl idea was to generate two functions - one with the AST and one with IOLists…use the AST for tree diff’ing and sending patches to the client and use IOLsts for full html string rendering (first page load)</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101160" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/73">Post #72</a>
	                </div>
	            </div>
              <div id="likers-container-101160" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101160"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #72"></div>
  </section>
</div>
    <div class="postbit" id="101161" data-post-id="101161">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="dgmcguire" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/120/12192_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  dgmcguire
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="72" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/t/77aa72/48.png" class="avatar"> tmbb:</div>
<blockquote>
<p>If you use smart heuristics (like react does), you can diff a tree in linear time on the number of nodes.</p>
</blockquote>
</aside>
<p>I believe I read recently that react was O(n^2) do you have a source for it being linear?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101161" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/74">Post #73</a>
	                </div>
	            </div>
              <div id="likers-container-101161" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101161"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #73"></div>
  </section>
</div>
    <div class="postbit" id="101162" data-post-id="101162">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="dgmcguire" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/120/12192_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  dgmcguire
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="72" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/t/77aa72/48.png" class="avatar"> tmbb:</div>
<blockquote>
<p>This requires storing the previous tree in memoy and comparing it with the new one though, which costs memory. By diffing the dynamic data directly, you save a lot of memory.</p>
</blockquote>
</aside>
<p>I’ve been doing a lot of thinking about this too and I think the memory will be negligible either way as 99% of realtime views will be spent viewing the same page.  That means you can cache the most up-to-date version in an ETS table for all up-to-date clients to diff against for the next change.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101162" data-batch-url="/posts/batch_likers">
                        2
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/75">Post #74</a>
	                </div>
	            </div>
              <div id="likers-container-101162" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101162"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #74"></div>
  </section>
</div>
    <div class="postbit" id="101163" data-post-id="101163">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tmbb" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tmbb
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>(clicked “Reply” by mistake, continues here)</p>
<p>Elixir is not a good language to work with the DOM. The DOM looks like a nice tree but it’s actually a nasty graph full of backreferences.</p>
<p>I suggest you tag everything with an ID so you can communicate unbiguously between the server and the client.</p>
<p>It might be fruitful to drop the tree structure and insead work with a flat database of nodes identified by a UUID or sometjing like that.</p>
<p>Then you can try to build a dependency graph between “paths” (some people like to call it cursors) on the data and the DOM nodes.</p>
<p>Then, you can rerender only the nodes that have changed and send them to the client. If you want to be very obsessive, you can dif the changed nodes to send actuall minimal diffs. That will result in less surprisss for the user, because you preserve more state (css transitions, input focus, etc). But even with minimal diffs you might overwrite some state…</p>
<p>That’s where somutions like morphdom come handy. I believe <a class="mention" href="/u/chrismccord" rel="nofollow">@chrismccord</a> got it right by commiting to diffing html on the client. The client knows more about the actual DOM the user is seeing than the server does.</p>
<p>When you accept you need to diff on the client, than I think it doesn’t make sense to buld a DOM (virtual or not) on the server, except for optimization purposes.</p>
<p>By building a DOM on the server, you can send smarter diffs to the client. This implies a tradeoff between performance on the browser and client: you spend CPU cycles and memory on the server to make the client slightly faster.</p>
<p>Testing whether this tradeoff makes sense is an wnormous undertaking, and I have decided not to get into that mess.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101163" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/76">Post #75</a>
	                </div>
	            </div>
              <div id="likers-container-101163" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101163"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #75"></div>
  </section>
</div>
    <div class="postbit" id="101164" data-post-id="101164">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tmbb" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tmbb
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="dgmcguire" data-post="74" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/48/12192_2.png" class="avatar"> dgmcguire:</div>
<blockquote>
<p>I believe I read recently that react was O(n^2) do you have a source for it being linear?</p>
</blockquote>
</aside>
<p>React is not actually linear. It’s only linear for “common diffs”. I think you can make it quadratic with especially crafted diffs. But for the common cases (a single element inserted into the list), I think it’s linear. I n’t find the source right now</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101164" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/77">Post #76</a>
	                </div>
	            </div>
              <div id="likers-container-101164" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101164"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #76"></div>
  </section>
</div>
    <div class="postbit" id="101167" data-post-id="101167">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="dgmcguire" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/120/12192_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  dgmcguire
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="76" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/t/77aa72/48.png" class="avatar"> tmbb:</div>
<blockquote>
<p>It might be fruitful to drop the tree structure and insead work with a flat database of nodes identified by a UUID or sometjing like that.</p>
</blockquote>
</aside>
<p>this is actually very appealing to me!  I’ll have to put more thought into this as it would solve a lot of problems.  If I can get away from tree diffing I think the CPU concerns may still be valid (but much less so than tree diffing), but the memory concerns should be negligible as I was saying I believe any realtime app will spend the vast majority of its time with all clients viewing the same content.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101167" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/78">Post #77</a>
	                </div>
	            </div>
              <div id="likers-container-101167" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101167"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #77"></div>
  </section>
</div>
    <div class="postbit" id="101168" data-post-id="101168">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tmbb" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tmbb
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="dgmcguire" data-post="73" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/48/12192_2.png" class="avatar"> dgmcguire:</div>
<blockquote>
<p>use the AST for tree diff’ing and sending patches to the client</p>
</blockquote>
</aside>
<p>Don’t do this. You don’t want to represent HTML using elixir AST, no matter how similar it is. Use 3-tuples (<code>{tag, attrs, contents}</code>) to represent HTML, but decouple them from Elixir’s AST.</p>
<p>To optimize the HTML you’re generating you can try to use macros like I do. A macro that expands into a 3-tuple or a list of 3-tuples can be optimized into static data. You have to think like a compiler writer. Using Floki to turn EEx into 3-tuples (AKA html) is cute but it’s beside the point… You need to get things working with 3-tuples. THEN you can think about presenting a better interface to the user. It’s perfectly viable to use Floki to parse an EEx file at compile time into something sensible which you can work with later. I’m just saying you should ignore that part for now.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101168" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/79">Post #78</a>
	                </div>
	            </div>
              <div id="likers-container-101168" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101168"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #78"></div>
  </section>
</div>
    <div class="postbit" id="101170" data-post-id="101170">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tmbb" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tmbb
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="dgmcguire" data-post="78" data-topic="16533">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/48/12192_2.png" class="avatar"> dgmcguire:</div>
<blockquote>
<p>I’ll have to put more thought into this as it would solve a lot of problems. If I can get away from tree diffing I think the CPU concerns may still be valid</p>
</blockquote>
</aside>
<p>I don’t know if your tree should be completely flat, but making it “flatter” would probably help. The way you usually implement graphs (and your approach might need a depednency graph!) is usually by leveraging pointers. In Elixir you don’t get pointers, so UUIDs might be the next best thing… It’s actually close to the mathematical definition of a graph, which is a pair (V, E) of sets, where the members of E (the edges) are pairs (u, v) where u and v belong to V. By having pointers to the tree nodes it’s easy to use graph algorithms.</p>
<p>As you can see in my first posts, I thought about using graphs for a while, but then I managed to avoid them. Working with graphs is not very pleasant in my opinion, but you can leverage things like <a href="https://github.com/bitwalker/libgraph" rel="noopener nofollow ugc">libgraph</a></p>
<blockquote>
<p>If I can get away from tree diffing</p>
</blockquote>
<p>I don’t think you can completely get away from tree diffing. The hard part of diffing trees is diffing lists of children. That won’t go away by flattening the tree . You’ll have to deal with diffs of lists anyway.</p>
<p>But the change of perspective that comes from flattening the tree might be very helpful!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101170" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/80">Post #79</a>
	                </div>
	            </div>
              <div id="likers-container-101170" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101170"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #79"></div>
  </section>
</div>
    <div class="postbit" id="101171" data-post-id="101171">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="dgmcguire" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/dgmcguire/120/12192_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  dgmcguire
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Good advice, thanks</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="101171" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/phoenixundeadview-lets-discuss-optimization-possibilities-for-something-like-phoenix-liveview/16533/81">Post #80</a>
	                </div>
	            </div>
              <div id="likers-container-101171" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="101171"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #80"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <a class="load-more-button" data-turbo-stream="true" href="/topics/16533/load_more?page=9">Load more posts (61 remaining)</a>
</div></template></turbo-stream>