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


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I agree those things are simple and easy for us. But are those things as intuitive for a junior developer? Also those things are decisions from past knowledge. Ask <a class="mention" href="/u/emily" rel="nofollow">@Emily</a>, decisions are hard.</p>
<p>If my friend, who has come right out of school, were to ask me the same question. I would tell him to use regular requests unless he needs to push real-time data to the client or he gets a better grasp on the Vue.js data situation.</p>
<p>My friend who has been in banking for years and is learning web development, I would tell them to use as little JavaScript as possible or let me create the backend.</p>
<p>From what I could see, this wasn’t <a class="mention" href="/u/emily" rel="nofollow">@Emily</a>’s only problem nor was it a problem that really should be stressed over. In any, I would never recommend learning WebSockets over AJAX requests.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="33735" 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/help-making-a-design-choice-ajax-vs-websocket/5145/32">Post #31</a>
	                </div>
	            </div>
              <div id="likers-container-33735" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="33735"
                     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="33737" data-post-id="33737">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="Azolo" data-post="32" data-topic="5145">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/azolo/48/2189_2.png" class="avatar"> Azolo:</div>
<blockquote>
<p>I agree those things are simple and easy for us. But are those things as intuitive for a junior developer? Also those things are decisions from past knowledge. Ask <a class="mention" href="/u/emily" rel="nofollow">@Emily</a>, decisions are hard.</p>
</blockquote>
</aside>
<p>Which is great that Phoenix already wrote the interface for us, now you just do <code>myTopic.send</code> and all such simple things instead, more simple than AJAX even then, you get JSON back immediately with no parsing needed.  <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="33737" 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/help-making-a-design-choice-ajax-vs-websocket/5145/33">Post #32</a>
	                </div>
	            </div>
              <div id="likers-container-33737" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="33737"
                     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="33839" data-post-id="33839">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>This thread has been a good read. Will mention 2 things I don’t think I saw here yet.</p>
<ol>
<li>
<p>there are things you get on the connection object with a full http request (through AJAX) you don’t in the websocket. So if you want the requesters IP on the server side for example you’ll find it there already waiting for you with ajax.</p>
</li>
<li>
<p>phoenix does indeed make websockets very easy and I’ve chosen to use them 99% of the time.  But I don’t like to underestimate that designing for channels is completely different and depending on application complexity could be hard to get used to.  For example I once designed something that when I added features you’d have to join dozens of channels to keep the data feed consistent.. with a simple design change it went down to 1, but it still involved a refactor.  Or bugs like accidentally pushing a client update to everyone on a certain page.  Again for someone experienced in this, less of an issue.</p>
</li>
</ol>
<p>I’m basing this completely on developer comfort, not speed/scale/etc</p>
<p>Without knowing either I think AJAX is a good choice.  Then again if you start with websockets maybe you end up with a pretty cool untarnished perspective… hrm <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">  what’s your risk tolerance..</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="33839" 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/help-making-a-design-choice-ajax-vs-websocket/5145/34">Post #33</a>
	                </div>
	            </div>
              <div id="likers-container-33839" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="33839"
                     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="86682" data-post-id="86682">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="OvermindDL1" data-post="11" data-topic="5145">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/overminddl1/48/2677_2.png" class="avatar"> OvermindDL1:</div>
<blockquote>
<p>Speaking of, you can use GraphQL over websockets too.</p>
</blockquote>
</aside>
<p>In what cases, it is recommended to use GraphQL over websockets, and vice versa?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="86682" 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/help-making-a-design-choice-ajax-vs-websocket/5145/35">Post #34</a>
	                </div>
	            </div>
              <div id="likers-container-86682" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="86682"
                     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="86683" data-post-id="86683">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>It is not an exclusive over… It means using GraphQL with websocket as the transport layer <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>
<p>And vice versa is not possible in that case.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="86683" 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/help-making-a-design-choice-ajax-vs-websocket/5145/36">Post #35</a>
	                </div>
	            </div>
              <div id="likers-container-86683" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="86683"
                     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="86776" data-post-id="86776">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>GraphQL is transport-layer-generic, it doesn’t care what it goes over, so websockets are good when you need more real-time communication, and things like absinthe can set up subscriptions over websockets to get live updates to singular queries.  <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="86776" 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/help-making-a-design-choice-ajax-vs-websocket/5145/37">Post #36</a>
	                </div>
	            </div>
              <div id="likers-container-86776" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="86776"
                     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="88752" data-post-id="88752">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I had a similar question so I thought I just asked it here.</p>
<p>In my app I have a form which has two select inputs, one for “Units” and one for “Subjects”, and Units have many Subjects.</p>
<p>So what I want is when you select a Unit, only Subjects belonging to that Unit will appear on the select box for Subjects. Simple enough.</p>
<p>Is this “feature” too simple to justify using Channels? After reading this thread it seems a simple AJAX request should be more appropriate, but I have zero experience with AJAX and little with Channels.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="88752" 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/help-making-a-design-choice-ajax-vs-websocket/5145/38">Post #37</a>
	                </div>
	            </div>
              <div id="likers-container-88752" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="88752"
                     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="88780" data-post-id="88780">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="antalvarenga" data-post="38" data-topic="5145">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/antalvarenga/48/6049_2.png" class="avatar"> antalvarenga:</div>
<blockquote>
<p>So what I want is when you select a Unit, only Subjects belonging to that Unit will appear on the select box for Subjects. Simple enough.</p>
<p>Is this “feature” too simple to justify using Channels? After reading this thread it seems a simple AJAX request should be more appropriate, but I have zero experience with AJAX and little with Channels.</p>
</blockquote>
</aside>
<p>Eh for autocomplete a simple ajax tends to be fine, unpoly even makes it very simple, or you can server-drive it over phoenix channels by using the <a href="https://forum.elixirforum.com/t/drab-remote-controlled-frontend-framework-for-phoenix/3277" rel="nofollow">Drab</a> library, which lets you drive it from phoenix over a websocket rather transparently.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="88780" 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/help-making-a-design-choice-ajax-vs-websocket/5145/39">Post #38</a>
	                </div>
	            </div>
              <div id="likers-container-88780" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="88780"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-last-post cat-last-post" title="Last post!"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <span class="all-loaded">— All posts loaded —</span>
</div></template></turbo-stream>