— Knock, knock — An async templates — Who’s there? - Alexander Khokhlov | Elixir Club 13
0 likes347 views
The document outlines the functionalities and benefits of nots.io, a documentation tracking and management tool designed to keep project documentation relevant and up-to-date while facilitating team discussions. It provides various coding templates, emphasizing the use of iolist and iodata in Elixir/Phoenix for efficient I/O operations. Additionally, it demonstrates the implementation of asynchronous tasks in template rendering to optimize web applications.
![But first
iolist() | iodata()
03 • Phoenix templates
IO.puts(["Hello, ", "Elixir"])
IO.puts ["Hello, ", 69, 108, 105, 120,
105, 114]
IO.puts ["Hello, ", [69, [108, [105,
[120, [105, [114, ]]]]]]]](https://image.slidesharecdn.com/asynctemplatealexanderkhokhlov-190523153554/85/Knock-knock-An-async-templates-Who-s-there-Alexander-Khokhlov-Elixir-Club-13-23-320.jpg)
![At compile time
https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/
03 • Phoenix templates
defmodule MyApp.SomeView do
defp(index.html(var!(assigns))) do
_ = var!(assigns)
{:safe, [(
tmp1 = ["" | "<h1>Listing Users</h1>nn<ul>n "]
[tmp1 | case(for(user <- Phoenix.HTML.Engine.fetch_assign(var!(assigns), :users)) do
{:safe, [(
tmp1 = [(
tmp1 = ["" | "n <li> “]
[tmp1 | case(user.first_name()) do
{:safe, data} ->
data
bin when is_binary(bin) ->
Plug.HTML.html_escape(bin)
other ->
Phoenix.HTML.Safe.to_iodata(other)
end]
) | " (“]
…
| "n</ul>nnThat's all!n"]}](https://image.slidesharecdn.com/asynctemplatealexanderkhokhlov-190523153554/85/Knock-knock-An-async-templates-Who-s-there-Alexander-Khokhlov-Elixir-Club-13-31-320.jpg)
![At the end
of the day {:safe, [[["" | "<h1>Listing Users</h1>nn<ul>n "],
[[[[["" | "n <li>"] | "Jane"] | " ("] | "1"] | ")</li>n "],
[[[[["" | "n <li>"] | "Joe"] | " ("] | "2"] | ")</li>n "]] |
"n</ul>nnThat's all!n"]}
iolist
In runtime
03 • Phoenix templates](https://image.slidesharecdn.com/asynctemplatealexanderkhokhlov-190523153554/85/Knock-knock-An-async-templates-Who-s-there-Alexander-Khokhlov-Elixir-Club-13-33-320.jpg)
![What if we
return Task 🤔
in pseudocode
04 • The solution
{:safe, [["" | "<div class="branch-selector"""> "],
["" | Task.async(fn -> render_dropdown() end)] ,
["" | "n</div>nn"]]}](https://image.slidesharecdn.com/asynctemplatealexanderkhokhlov-190523153554/85/Knock-knock-An-async-templates-Who-s-there-Alexander-Khokhlov-Elixir-Club-13-36-320.jpg)
![And when
everything is
ready — convert
04 • The solution
defmodule Notsapp.TemplateRenderer do
def process_rendered_template([h|t]) do
[process_rendered_template(h) | process_rendered_template(t)]
end
def process_rendered_template(%Notsapp.CljTask{task: task}) do
Task.await(task)
end
def process_rendered_template(e) do
e
end
defmacro __using__(_opts) do
quote do
def render(template, assigns) do
{:safe, io_list} = render_template(template, assigns)
{:safe, process_rendered_template(io_list)}
end
end
end
end](https://image.slidesharecdn.com/asynctemplatealexanderkhokhlov-190523153554/85/Knock-knock-An-async-templates-Who-s-there-Alexander-Khokhlov-Elixir-Club-13-37-320.jpg)
— Knock, knock — An async templates — Who’s there? - Alexander Khokhlov | Elixir Club 13
- 1. Alexander Khokhlov @nots_ioNots.io — Knock, knock — An async template — Who’s there?
- 7. README.md Code Comments JavaDoc GDocs Confluence / DokuWiki / Wiki
- 8. Nots.io Add docs for block of code, function, module, file, commit or branch 01
- 9. Notes, Tied to Code Easy to Discover Easy to Explore Easy to Get Scope Easy to Ask and Discuss 01 • Nots.io
- 10. We Track Relevance You always know what’s fresh and what’s not. Promotes keeping docs up-to-date. Rewarding when everything is ✅ 01 • Nots.io
- 11. Discuss with your Team You won’t loose a dispute that is written down. It’s tied and has context 01 • Nots.io
- 12. And many more awesome things 🔥 01 • Nots.io
- 14. Choose File page 02 • Nots.io case
- 15. 02 • Nots.io case
- 16. In the template 02 • Nots.io case .branch-selector = Notsapp.Renderer.simple_component({:"dropdown/dropdown", …}) %h2 Files .tree = Notsapp.Renderer.simple_component({:"code-tree/tree", …})
- 17. Microservices YAY! 02 • Nots.io case
- 18. ⛔ ⛔ Blocking 04 .branch-selector = Notsapp.Renderer.simple_component({:"dropdown/dropdown", …}) %h2 Files .tree = Notsapp.Renderer.simple_component({:"code-tree/tree", …})
- 19. But we want non-blocking 02 🚀
- 20. Good news: It’s doable! 02
- 21. But first 03
- 23. But first iolist() | iodata() 03 • Phoenix templates IO.puts(["Hello, ", "Elixir"]) IO.puts ["Hello, ", 69, 108, 105, 120, 105, 114] IO.puts ["Hello, ", [69, [108, [105, [120, [105, [114, ]]]]]]]
- 24. But first iolist() | iodata() Does not allocate new strings: Repeated chunks are created only once Does not concatenate strings/chars: Append to the list is O(1) and doesn’t require copying anything. 03 • Phoenix templates
- 25. Use iolist for I/O iolist() | iodata() With iolist & iodata work: Console I/O functions File I/O function :gen_tcp.send() :gen_udp.send() 03 • Phoenix templates
- 26. What about Elixir & Phoenix? 03 • Phoenix templates
- 27. At compile time Phoenix runs through the templates folder Uses EEx to convert each template into a function phoenix/lib/phoenix/template.ex 03 • Phoenix templates
- 28. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates
- 29. At compile time 03 • Phoenix templates
- 30. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates
- 31. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates defmodule MyApp.SomeView do defp(index.html(var!(assigns))) do _ = var!(assigns) {:safe, [( tmp1 = ["" | "<h1>Listing Users</h1>nn<ul>n "] [tmp1 | case(for(user <- Phoenix.HTML.Engine.fetch_assign(var!(assigns), :users)) do {:safe, [( tmp1 = [( tmp1 = ["" | "n <li> “] [tmp1 | case(user.first_name()) do {:safe, data} -> data bin when is_binary(bin) -> Plug.HTML.html_escape(bin) other -> Phoenix.HTML.Safe.to_iodata(other) end] ) | " (“] … | "n</ul>nnThat's all!n"]}
- 32. Gosh! 03 • Phoenix templates
- 33. At the end of the day {:safe, [[["" | "<h1>Listing Users</h1>nn<ul>n "], [[[[["" | "n <li>"] | "Jane"] | " ("] | "1"] | ")</li>n "], [[[[["" | "n <li>"] | "Joe"] | " ("] | "2"] | ")</li>n "]] | "n</ul>nnThat's all!n"]} iolist In runtime 03 • Phoenix templates
- 34. Rewind ⏪ 04 .branch-selector = Notsapp.Renderer.simple_component({:"dropdown/dropdown", …}) %h2 Files .tree = Notsapp.Renderer.simple_component({:"code-tree/tree", …})
- 35. What if we return Task 🤔 Instead of HTML 04 • The solution task = Task.async(fn -> do_heavy_work() end) IO.puts "Do some more work" result = Task.await(task)
- 36. What if we return Task 🤔 in pseudocode 04 • The solution {:safe, [["" | "<div class="branch-selector"""> "], ["" | Task.async(fn -> render_dropdown() end)] , ["" | "n</div>nn"]]}
- 37. And when everything is ready — convert 04 • The solution defmodule Notsapp.TemplateRenderer do def process_rendered_template([h|t]) do [process_rendered_template(h) | process_rendered_template(t)] end def process_rendered_template(%Notsapp.CljTask{task: task}) do Task.await(task) end def process_rendered_template(e) do e end defmacro __using__(_opts) do quote do def render(template, assigns) do {:safe, io_list} = render_template(template, assigns) {:safe, process_rendered_template(io_list)} end end end end
- 38. Apply to every view 04 • The solution def view do quote do use Phoenix.View use Notsapp.TemplateRenderer # <-- use Phoenix.HTML
- 39. In parallel
- 40. Thank you 🤘