— An async template - Oleksandr Khokhlov | Elixir Club Ukraine
Report
Share
•0 likes•394 views
![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/anasynctemplate-oleksandrkhokhlov-191002130435/75/an-async-template-oleksandr-khokhlov-elixir-club-ukraine-18-2048.jpg?cb=1668255096)
![At the end
of the day iex(1)> PageView.render("index.html", hello: "Elixir!")
{:safe,
[“<body>n <h1>Hello, n", "Elixir!", " </h1>n</body>n"]}
iolist
In runtime
03 • Phoenix templates](https://image.slidesharecdn.com/anasynctemplate-oleksandrkhokhlov-191002130435/75/an-async-template-oleksandr-khokhlov-elixir-club-ukraine-29-2048.jpg?cb=1668255096)
![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/anasynctemplate-oleksandrkhokhlov-191002130435/75/an-async-template-oleksandr-khokhlov-elixir-club-ukraine-32-2048.jpg?cb=1668255096)
![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/anasynctemplate-oleksandrkhokhlov-191002130435/75/an-async-template-oleksandr-khokhlov-elixir-club-ukraine-33-2048.jpg?cb=1668255096)
— An async template - Oleksandr Khokhlov | Elixir Club Ukraine
•0 likes•394 views
Report
Share
Download to read offline
Slides of Oleksandr Khokhlov, Founder at Nots.io, at Elixir Club Ukraine, Kyiv, 28.09.2019 Next conference - http://www.elixirkyiv.club/ Description of presentation Elixir and Erlang platform are all about asynchronous communications. Why don’t we use this feature while rendering templates? In this talk, Oleksandr unveils how we in Nots.io split HTML documents into smaller pieces and render them in parallel. Follow us on social networks @ElixirClubUA and #ElixirClubUA Announce and materials from conf - https://www.fb.me/ElixirClubUA News - https://twitter.com/ElixirClubUA Photo and free atmosphere - https://www.instagram.com/ElixirClubUA *Organizer’s chanel - https://t.me/incredevly
More Related Content
Similar to — An async template - Oleksandr Khokhlov | Elixir Club Ukraine
![[DanNotes] XPages - Beyound the Basics](https://cdn.slidesharecdn.com/ss_thumbnails/dannotes052012-beyondthebasics-120430052622-phpapp01-thumbnail.jpg?width=384&fit=bounds)
Similar to — An async template - Oleksandr Khokhlov | Elixir Club Ukraine(20)
![[DanNotes] XPages - Beyound the Basics](https://cdn.slidesharecdn.com/ss_thumbnails/dannotes052012-beyondthebasics-120430052622-phpapp01-thumbnail.jpg?width=768&fit=bounds)
More from Elixir Club
More from Elixir Club(20)
Recently uploaded
Recently uploaded(20)
— An async template - Oleksandr Khokhlov | Elixir Club Ukraine
- 1. Alexander Khokhlov @nots_ioNots.io — Knock, knock — An async template — Who’s there?
- 4. 01 • Nots.io Company’s documentation: Hard to find Determine if fits the scope Check whether relevant
- 5. Nots.io Add docs for block of code, function, module, file, commit or branch 01
- 6. 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
- 8. Choose File page 02 • Nots.io case
- 9. 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", …})
- 10. 02 • Nots.io case
- 11. Microservices YAY! 02 • Nots.io case
- 12. ⛔ ⛔ Blocking 02 .branch-selector = Notsapp.Renderer.simple_component({:"dropdown/dropdown", …}) %h2 Files .tree = Notsapp.Renderer.simple_component({:"code-tree/tree", …})
- 13. But we want non-blocking 02 🚀
- 14. Good news: It’s doable! 02
- 15. But first 03
- 17. But first strings 03 • Phoenix templates Bitstrings: << … >> Binaries: bitstring with size(8) String: binary with valid UTF8 codepoints Charlist: list of integer codepoints Phoenix strings: {:safe, String}
- 18. 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, ]]]]]]]
- 19. 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
- 20. 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
- 21. What about Elixir & Phoenix? 03 • Phoenix templates
- 22. At compile time Phoenix runs through the templates folder Uses EEx engine to convert each template into a function phoenix/lib/phoenix/template.ex 03 • Phoenix templates
- 23. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates <body> <h1>Hello, <%= @hello %> </h1> </body>
- 24. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates
- 25. At compile time 03 • Phoenix templates
- 26. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates Reveal macro magic
- 27. At compile time https://www.bignerdranch.com/blog/elixir-and-io-lists-part-2-io-lists-in-phoenix/ 03 • Phoenix templates Generated code of view
- 28. Gosh! 03 • Phoenix templates
- 29. At the end of the day iex(1)> PageView.render("index.html", hello: "Elixir!") {:safe, [“<body>n <h1>Hello, n", "Elixir!", " </h1>n</body>n"]} iolist In runtime 03 • Phoenix templates
- 30. Rewind ⏪ 04 .branch-selector = Notsapp.Renderer.simple_component({:"dropdown/dropdown", …}) %h2 Files .tree = Notsapp.Renderer.simple_component({:"code-tree/tree", …})
- 31. 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)
- 32. What if we return Task 🤔 in pseudocode 04 • The solution {:safe, [["" | "<div class="branch-selector"""> "], ["" | Task.async(fn -> render_dropdown() end)] , ["" | "n</div>nn"]]}
- 33. 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
- 34. Apply to every view 04 • The solution def view do quote do use Phoenix.View use Notsapp.TemplateRenderer # <-- use Phoenix.HTML
- 35. In parallel
- 36. Thank you 🤘