Пишем frontent на golang13.07.2021 12:16

Ой, все чудесится и чудесится!
— Л. Кэррол, Алиса в Стране Чудес

375b5e56b6eb6265666ed4ae33baefb2.jpg

  • Вас задрало, что node_modules на простом сайте соревнуются по количеству используемого места с вашей коллекцией музыки?

  • Вы перечитали инструкцию к Redux  в шестидесятый раз и поняли две вещи: «До меня кажется доходит…» и «Думаю, мне стоит перечитать это ещё раз!»

  • Вы в очередной раз узнали, что 1 + »1» == »11», а [] — {} == NaN?

  • Билд скрипт в webpack занимает больше места чем ваша библиотека на javascript?

Тогда заходите под кат, я покажу вам, как можно перевести ваш фронтэнд на го. 

Встречаем, vugu. Молодая (сразу предупреждаю, не релизнутая) и очень интересная библиотека, которая позволяет вам использовать golang напрямую в html. Естественно, так как пока не существует браузеров со встроенной поддержкой golang, то реализовывать всё пришлось через WASM. 

Vugu это очень молодая библиотека и упоминаний о ней на хабре я не нашёл, за исключением пары дайджестов. 

Давайте посмотрим и потрогаем эту библиотеку изнутри. И так, что же такое vugu?

Для начала, давайте представим, что вы пишите html компонент, только скрипты имеют тип application/x-go вместо javascript: 


    

        Conditional text here.

Вы сохраняете вышеописанное безобразие в файл с расширением *.vugu и запускаете стороннюю библиотеку, которая жрёт 5 гигов памяти. Ладно, шучу, на самом деле vugu был создан с целью упростить процесс разработки, вместо того, чтобы его усложнить. Всё что вам необходимо делать в vugu можно сделать средствами самого go. Для компиляции приложения можно воспользоваться простыми: 

go generate
go build
./file-name

В комплекте идёт утилита, для облегчения разработки, под названием vgrun, но это просто обёртка над стандартными командами. Для простоты иллюстраций я буду использовать именно эту библиотеку.

vgrun devserver.go

запустит простой сервер, и начнёт следить за файлами на предмет изменений. Если оные находятся, то программа автоматически перезапускает сервер и обновляет приложение. Просто и без наворотов. 

Что же, пришло время проследить путь vugu файла до конечного пользователя. 

  1. Файл парсится html парсером. Да, файл должен содержать полностью рабочий HTML. 

  2. После этого файл ещё раз парсится vugu парсером. Тут файл разбирается на части и пересобирается в go. Сгенерированный код это полностью рабочий код на golang.

  3. Полученный файл компилируется в WASM и упаковывается в web assembly для запуска на клиенте. 

  4. PROFIT!

Ну вот и всё. Можете расходиться. Тут всё понятно.

Что? Надо больше? Ладно, так уж и быть. Давайте закапываться глубже и делать больше. Давайте для начала посмотрим на сгенерированный golang файл. Файл называется 0_components_vgen.go. В него и пойдём.

Код из  



  • 
  :

    •

    В этом примере вы можете видеть, как просто создавать и использовать компоненты в vugu.

    Ну и напоследок, wasm файл, который получается на выходе, весит 7 метров. Это на порядок лучше, чем то, что выдаёт Blazor, но мы можем пойти глубже.

    Что если я скажу, что вы можете запустить ваш проект написанный на vugu в tinygo? Именно это я вам и говорю. 

    Идём на https://www.vugu.org/doc/tinygo и запускаем билд либо через докер, либо с помощью синей изоленты и кузькиной матери. На выходе мы получаем замечательный wasm файл, который весит 500килобайт. Ура! Всем по кошаку! Получайте, сколько хотите!  

    Ладно, хватит разглагольствовать, идём и читаем официальную документацию на https://www.vugu.org/doc.

    После этого можно идти и читать намного более объёмную документацию на https://pkg.go.dev/github.com/vugu/vugu/.

    Я связался с автором проекта и проверил, проект не запущен, хотя документация устарела. Я лично предложил свою помощь в обновлении документации и развитии проекта, так что vugu в массы. Но, несмотря на это, вот вам официальное заявление:

    Проект, всё же, находится в режиме тестирования. Например, последняя версия  tinigo сломала компиляцию wasm кода. Так что пользуйтесь на свой страх и риск. Но, пользуйтесь. Это весело.

    Если у кого-то есть вопросы — создавайте issue, делайте PR или пишите мне в личку, я могу написать создателям в Slack.

    Удачного всем погружения в vugu!

    © Habrahabr.ru