<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="96177" data-post-id="96177">
  <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
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote group-livebook_core_team" data-username="josevalim" data-post="30" data-topic="16445">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/48/1787_2.png" class="avatar"> josevalim:</div>
<blockquote>
<p>This is the approach I suggested but it doesn’t work with nesting (for example, <code>form_for</code> ). So when using LiveView someone would need to reduce the amount of nesting that happens in templates (it is doable though).</p>
</blockquote>
</aside>
<p>If does work with nesting, it’s just less efficient. If the nesting happens in a big for loop, you simply send the result of the for loop as a dynamic substring. It’s not optimal, though… The user must write the template using as much concrete EEx syntax (no nested templates, no reusable widgets, etc.) as possible. Unless the widgets are macros, in which case we can expand them and isolate the dynamic parts (should be a fun exercise in static analysis). It’s still strictly better than sending the full webpage.</p>
<p>To do better than that one probably has to do some hardcore static analysis (which I believe Drab does).</p>
<aside class="quote group-livebook_core_team" data-username="josevalim" data-post="30" data-topic="16445">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/48/1787_2.png" class="avatar"> josevalim:</div>
<blockquote>
<p>Hard to say which one is the best without benchmarking and looking at example applications.</p>
</blockquote>
</aside>
<p>Exactly! Besides saying that sending less data is always better, I don’t think there are many hard and fast rules here.</p>
<p>But if I had to bet, and without any hard data to look at, of course, I’d bet it will be hard to do better than our (yours and mine) naive approach of going only one level deep with no fancy caching of substrings besides what we get for free when using IOLists.</p>
<p>EDIT (further baseless speculation): going deeper than one level is tempting, of course, but then you need some sort of caching to compare the previous tree to the new one (and congratulations! you’ve just implemented your simplified VDOM on the server!). And caching consumes non-trivial amouns of memory. Maybe one could use checksums? If you checksum a string into a small int (&lt; 32bits, for example) you get a negligible probability of collisions with a very low memory overhead. As long as the checksum function is fast, it could work. You could turn the (nested IOList) into a tree of checksums, which would be very easy to diff agains the old one (like a <a href="https://en.wikipedia.org/wiki/Merkle_tree" rel="noopener nofollow ugc">Merkle Tree</a> with no cryptographic hashes) with a non-cryptoraphic hash. Diffing HTML on the blockchain, <em>yeahhhh baby!!!</em>. I should stop now. But baseless speculation about algorithms is fun!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96177" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/32">Post #31</a>
	                </div>
	            </div>
              <div id="likers-container-96177" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96177"
                     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 #31"></div>
  </section>
</div>
    <div class="postbit" id="96186" data-post-id="96186">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="josevalim" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/120/1787_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  josevalim
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Creator of Elixir</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="32" data-topic="16445">
<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 does work with nesting, it’s just less efficient.</p>
</blockquote>
</aside>
<p>Unforutnately somebody can do this:</p>
<pre><code class="lang-plaintext">&lt;%= convert_io_data_to_html_and_do_a_string_replace_on_some_tags(for foo &lt;- foos do %&gt;
  &lt;foo&gt;bar &lt;%= foo.id %&gt;&lt;/foo&gt;
&lt;% end) %&gt;
</code></pre>
<p>Plus if we want to support nesting it means we need to generate identifiers, traverse, encode and decode them. So I don’t think it is worth it. If you want to go down this road, then a proper template engine is the way to go.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96186" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/33">Post #32</a>
	                </div>
	            </div>
              <div id="likers-container-96186" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96186"
                     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 #32"></div>
  </section>
</div>
    <div class="postbit" id="96187" data-post-id="96187">
  <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
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>So that’s the kind of nesting you’re talking about <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p>
<aside class="quote group-livebook_core_team" data-username="josevalim" data-post="33" data-topic="16445">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/48/1787_2.png" class="avatar"> josevalim:</div>
<blockquote>
<p>Unforutnately somebody can do this:</p>
</blockquote>
</aside>
<p>Once you compile the template into a quoted expression, isn’t it easy to mark the whole thing as a “dynamic substring”? (I’m not testing it mysef because I’m away from the computer)</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96187" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/34">Post #33</a>
	                </div>
	            </div>
              <div id="likers-container-96187" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96187"
                     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 #33"></div>
  </section>
</div>
    <div class="postbit" id="96192" data-post-id="96192">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="josevalim" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/120/1787_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  josevalim
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Creator of Elixir</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="tmbb" data-post="34" data-topic="16445">
<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>Once you compile the template into a quoted expression, isn’t it easy to mark the whole thing as a “dynamic substring”? (I’m not testing it mysef because I’m away from the computer)</p>
</blockquote>
</aside>
<p>Yes, totally. We just can’t do the “smart diff”.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96192" 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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/35">Post #34</a>
	                </div>
	            </div>
              <div id="likers-container-96192" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96192"
                     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 #34"></div>
  </section>
</div>
    <div class="postbit" id="96193" data-post-id="96193">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="cnck1387" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  cnck1387
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>One thing I was curious about when it came to input fields is, on video you mentioned on every key press this validation takes place, but do you think we should allow for overriding this behavior with a configuration option to account for “typewatch” delay.</p>
<p>For example if I’m typing out an email address, I really don’t need validation to happen on every single character as I press it. What I really want is the validation to happen 2-3 seconds after I stop typing. This way when I type normally, I might hit the server once or twice instead of 30 times.</p>
<p>This could alleviate a lot of extra round trips. Maybe each form you attach these events to could have an option to enable a typewatch delay which defaults to either a 2-3 second delay or 0, whatever ends up being best after testing this out for real.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96193" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/36">Post #35</a>
	                </div>
	            </div>
              <div id="likers-container-96193" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96193"
                     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 #35"></div>
  </section>
</div>
    <div class="postbit" id="96194" data-post-id="96194">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tme_317" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tme_317
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="hilko" data-post="27" data-topic="16445">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/h/c57346/48.png" class="avatar"> hilko:</div>
<blockquote>
<p>Honestly, the only reason I dislike this whole LiveView/Drab-like approach is that I just recently converted a ‘regular’ Phoenix app, views and templates, to an JSON API-based approach with the usual Rube Goldberg client-side React implementation ;-). I’d much rather have stuck with Phoenix’ server-side rendering…</p>
</blockquote>
</aside>
<p>Haha exactly this.  If LiveView existed a year ago my formerly EEx-based project would be live by now!</p>
<p>But, hey, at least I feel much smarter having spent many months learning enough es6, then vue then react/jsx, nextjs, reasonml, webpack, and absinthe/graphql just to get client-side form validation!  I know not all of those were strictly necessary… I could have just sprinkled some js/jquery or maybe used something like unpoly to get the job done but a future feature requires substantial client-side state so figured I’d go “all in”. Needless to say Chris’ Rube Goldberg slide in this talk and how he described it as “absolute insanity” really resonated with me.  As he states, LiveView represents a HUGE improvement in time-to-market for a wide variety of use cases in the middle of the continuum.</p>
<p>For me, after that fun rewrite everything works well at this point and it’s just too late to go back.  It was a major sunk upfront cost that LiveView addresses but at this point the big unknown is how my future maintenance/change iteration cost differs between a LiveView approach and the React SPA approach.  I guess we will see.  <img src="https://forum.elixirforum.com/images/emoji/apple/grimacing.png?v=15" title=":grimacing:" class="emoji" alt=":grimacing:" loading="lazy" width="20" height="20"></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96194" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/37">Post #36</a>
	                </div>
	            </div>
              <div id="likers-container-96194" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96194"
                     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 #36"></div>
  </section>
</div>
    <div class="postbit" id="96202" data-post-id="96202">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="chrismccord" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/chrismccord/120/24233_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  chrismccord
                  </h3>
		          </div>
						
			          <div class="user-title">
									<span>Creator of Phoenix</span>
			          </div>
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Yes, some kind of configurable delay is planned as not everyone needs instant keyup events. My goal is to focus these things around UX rather than saving round trips since we should be able to get away with it. So for keyup events, my goal is to focus the UI updates exactly how you would for a client side app, so you would use whatever makes the best experience for the user. There are of course perf considerations, but we can push a lot further than most folks realize <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96202" 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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/38">Post #37</a>
	                </div>
	            </div>
              <div id="likers-container-96202" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96202"
                     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 #37"></div>
  </section>
</div>
    <div class="postbit" id="96217" data-post-id="96217">
  <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
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote group-livebook_core_team" data-username="josevalim" data-post="35" data-topic="16445">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/josevalim/48/1787_2.png" class="avatar"> josevalim:</div>
<blockquote>
<p>Yes, totally. We just can’t do the “smart diff”.</p>
</blockquote>
</aside>
<p>Yes, this is exactly the limitation I had in mind. Maybe I didn’t explain myself clearly. I think there should be no “smart” and no “diffing”: what is static is static, and what is dynamic is dynamic.</p>
<p>What can help a little here is replacing some (most?) of the functions in <code>Phoenix.HTML</code> by macros (<code>Phoenix.LiveView.HTML</code>, for example). One can use macros whenever the function is not recursive (or at least the recursion is bounded).</p>
<p>That will give us a big quoted expression, from which we can try to separate the static parts from the dynamic parts. That might become hairy but it’s just an exercise of turning a tree inside out, or something like that. As long as you stick to the default widgets or widgets that are implemented as macros you can support a bounded level of nesting.</p>
<p>That would suport form_for in most cases where it’s used.</p>
<p>And not smart diffing required.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96217" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/39">Post #38</a>
	                </div>
	            </div>
              <div id="likers-container-96217" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96217"
                     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 #38"></div>
  </section>
</div>
    <div class="postbit" id="96268" data-post-id="96268">
  <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
                  </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="14" data-topic="16445">
<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>From what I knwo about EEx templates, this seems very easy.</p>
</blockquote>
</aside>
<p>I take this back. It is NOT very easy… Chunks like <code>&lt;% x = ... %&gt;</code> require compiling the template into a <code>{:__block__, meta, expressions}</code>, which forces us to deal with variable assignments which might possibly overwrite each other. To split the template into static and dynamic parts it looks like one has to (at least) convert Elixir blocks with variable assignment into single static assignment (i.e. almost the same as compiling macroexpanded Elixir into Erlang). Then it becomes easier to factor variable assignments outside the dynamic strings. I feel like I’m derailing this thread a little, and I might start a new one to discuss these matters.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96268" data-batch-url="/posts/batch_likers">
                        0
                      </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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/40">Post #39</a>
	                </div>
	            </div>
              <div id="likers-container-96268" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96268"
                     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 #39"></div>
  </section>
</div>
    <div class="postbit" id="96316" data-post-id="96316">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Instead of choosing LiveView <em>or</em> React, would it be possible to choose LiveView <em>and</em> React (or <a href="https://mithril.js.org/" rel="noopener nofollow ugc">Mithril</a>, <a href="https://svelte.technology/" rel="noopener nofollow ugc">Svelte</a>,  Vue, etc.)?</p>
<p>Would an umbrella app be the only way to go?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="96316" 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/54-elixirconf-us-2018-closing-keynote-chris-mccord/16445/41">Post #40</a>
	                </div>
	            </div>
              <div id="likers-container-96316" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="96316"
                     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 #40"></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/16445/load_more?page=5">Load more posts (46 remaining)</a>
</div></template></turbo-stream>