{"id":71628,"date":"2020-02-27T08:51:24","date_gmt":"2020-02-27T05:51:24","guid":{"rendered":"https:\/\/prohoster.info\/blog\/aleksej-grachyov-go-frontend"},"modified":"2020-03-03T16:14:16","modified_gmt":"2020-03-03T13:14:16","slug":"aleksej-grachyov-go-frontend","status":"publish","type":"post","link":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/aleksej-grachyov-go-frontend","title":{"rendered":"Alexej Gra\u010dov: Go Frontend","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p>Kyiv Go Meetup Kv\u011bten 2018:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/9974ab1db5347a41e4ec5110c3d2ef56.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Moder\u00e1tor:<\/b> \u2013 Ahoj v\u0161ichni! D\u011bkuji, \u017ee jste p\u0159i\u0161li! Dnes m\u00e1me dva ofici\u00e1ln\u00ed \u0159e\u010dn\u00edky \u2013 Ljo\u0161a a Va\u0148a. Budou je\u0161t\u011b dva, pokud bude \u010das. Prvn\u00edm \u0159e\u010dn\u00edkem je Alexej Gra\u010dev, ten n\u00e1m pov\u00ed o GopherJS.<\/p>\n<p><b>Alexej Gra\u010dev (d\u00e1le \u2013 AG):<\/b> \u2013 Jsem Go v\u00fdvoj\u00e1\u0159 a p\u00ed\u0161u webov\u00e9 slu\u017eby v Go. N\u011bkdy se mus\u00edm zab\u00fdvat front-endem, n\u011bkdy se tam mus\u00edm dostat i fyzicky. Chci se pod\u011blit o sv\u00e9 zku\u0161enosti a v\u00fdzkum Go na front-endu.<\/p>\n<p>Legenda je takov\u00e1: nejprve si promluv\u00edme o tom, pro\u010d chceme spou\u0161t\u011bt Go na front-endu, pot\u00e9 si \u0159ekneme, jak to lze ud\u011blat. Existuj\u00ed dv\u011b cesty \u2013 Web Assembly a GopherJS. Pod\u00edv\u00e1me se, v jak\u00e9m stavu jsou tato \u0159e\u0161en\u00ed a co se d\u00e1 d\u011blat.<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<h3>Co je \u0161patn\u011b s front-endem?<\/h3>\n<p>\nJsou v\u0161ichni pro, \u017ee je s front-endem v\u0161e v po\u0159\u00e1dku?<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/065119e699053306072b1d7aa3183b34.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nM\u00e1lo test\u016f? Pomalu se stav\u00ed? Ekosyst\u00e9m? Dob\u0159e.<\/p>\n<p>Pokud jde o front-end, l\u00edb\u00ed se mi cit\u00e1t, kter\u00fd \u0159ekl jeden z front-end v\u00fdvoj\u00e1\u0159\u016f ve sv\u00e9 knize:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/e69eba4fc073c0b59789859c94ba29f2.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nV Javascriptu nen\u00ed typov\u00fd syst\u00e9m. Te\u010f budu zmi\u0148ovat probl\u00e9my, se kter\u00fdmi jsem se setkal b\u011bhem sv\u00e9 pr\u00e1ce, a vysv\u011btl\u00edm, jak je \u0159e\u0161\u00ed.<\/p>\n<p>T\u011b\u017eko lze v\u016fbec nazvat syst\u00e9m typ\u016f v Javascriptu \u2013 jsou tam \u0159et\u011bzce, kter\u00e9 reprezentuj\u00ed typ objektu, ale ve skute\u010dnosti to s typy nem\u00e1 nic spole\u010dn\u00e9ho. Tento probl\u00e9m vy\u0159e\u0161ilo TypeScript (roz\u0161\u00ed\u0159en\u00ed nad Javascript) a Flow (statick\u00fd kontrolor typ\u016f v Javascriptu). Vlastn\u011b u\u017e front-end dosp\u011bl k \u0159e\u0161en\u00ed probl\u00e9mu \u0161patn\u00e9ho typov\u00e9ho syst\u00e9mu v Javascriptu.<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/257542cbfd2e316fbe0a0033056fff6f.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nStandardn\u00ed knihovna v prohl\u00ed\u017ee\u010di jako takov\u00e1 neexistuje \u2013 existuj\u00ed n\u011bjak\u00e9 vestav\u011bn\u00e9 objekty a \"magick\u00e9\" funkce v prohl\u00ed\u017ee\u010d\u00edch. Ale v Javascriptu jako takov\u00e9m standardn\u00ed knihovna chyb\u00ed. Tento probl\u00e9m byl kdysi \u0159e\u0161en jQuery (v\u0161ichni pou\u017e\u00edvali jQuery se v\u0161emi prototypy, pomocn\u00edky, funkcemi, kter\u00e9 jsou pot\u0159eba pro pr\u00e1ci). Dnes u\u017e v\u011bt\u0161ina pou\u017e\u00edv\u00e1 Lodash:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/4eae8a8f19776028bd88fe8f7a751605.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nCallback hell. Mysl\u00edm, \u017ee v\u0161ichni vid\u011bli k\u00f3d v Javascriptu n\u011bkde p\u0159ed 5 lety, a vypadal jako \"nudle\" z neuv\u011b\u0159iteln\u00e9ho spletence callback\u016f. Te\u010f u\u017e je tento probl\u00e9m vy\u0159e\u0161en (s vyd\u00e1n\u00edm ES-15 nebo ES-16), do Javascriptu byly p\u0159id\u00e1ny promisy (promises) a v\u0161em se na chv\u00edli ulevilo.<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/96c574a880ad97e0802ae3006a60cee6.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nPokoji nep\u0159i\u0161lo Promice hell... Nev\u00edm, jak to front-end pr\u016fmysl zvl\u00e1d\u00e1, ale po\u0159\u00e1d se dost\u00e1v\u00e1 do n\u011bjak\u00fdch podivn\u00fdch situac\u00ed. Dok\u00e1zali vytvo\u0159it hell i na \"promisech\". Pak tento probl\u00e9m vy\u0159e\u0161ili p\u0159id\u00e1n\u00edm nov\u00e9ho primitiva \u2013 async\/await:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/7c0679babbea4583de924292893d805c.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nS asynchronnost\u00ed je probl\u00e9m vy\u0159e\u0161en. Async\/await \u2013 je dost popul\u00e1rn\u00ed primitiv v r\u016fzn\u00fdch jazyc\u00edch. V Pythonu a dal\u0161\u00edch takov\u00fd p\u0159\u00edstup existuje \u2013 je dost dobr\u00fd. Probl\u00e9m byl vy\u0159e\u0161en.<\/p>\n<p>Jak\u00fd probl\u00e9m nebyl vy\u0159e\u0161en? R\u016fst komplexity framework\u016f v geometrick\u00e9 \u0159ad\u011b, slo\u017eitost ekosyst\u00e9mu a samotn\u00fdch program\u016f.<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/617fbc72e9e059bf608a48c84c5328f9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>Syntaxe JavaScriptu je pon\u011bkud zvl\u00e1\u0161tn\u00ed. V\u0161ichni v\u00edme o probl\u00e9mech se s\u010d\u00edt\u00e1n\u00edm pole a objektu a dal\u0161\u00edch vype\u010denostech.<\/li>\n<li>JavaScript je multiparadigmatick\u00fd. V sou\u010dasnosti je to zvl\u00e1\u0161\u0165 aktu\u00e1ln\u00ed syst\u00e9m, kdy\u017e je ekosyst\u00e9m velmi rozs\u00e1hl\u00fd:\n<ul>\n<li>v\u0161ichni p\u00ed\u0161\u00ed v r\u016fzn\u00fdch stylech \u2013 n\u011bkte\u0159\u00ed p\u00ed\u0161\u00ed strukturovan\u011b, n\u011bkte\u0159\u00ed funk\u010dn\u011b, r\u016fzn\u00ed v\u00fdvoj\u00e1\u0159i p\u00ed\u0161\u00ed r\u016fzn\u011b;<\/li>\n<li>z r\u016fzn\u00fdch bal\u00ed\u010dk\u016f (packages) vypl\u00fdvaj\u00ed r\u016fzn\u00e9 paradigmata, kdy\u017e pou\u017e\u00edv\u00e1te r\u016fzn\u00e9 bal\u00ed\u010dky;<\/li>\n<li>je spousta \"z\u00e1bavy\" s funkcion\u00e1ln\u00edm programov\u00e1n\u00edm v JavaScriptu \u2013 vznikla knihovna Ramda a te\u010f nikdo nem\u016f\u017ee \u010d\u00edst programy napsan\u00e9 v t\u00e9to knihovn\u011b.<\/li>\n<\/ul>\n<p>\n<\/li>\n<li>To v\u0161e m\u00e1 velk\u00fd dopad na ekosyst\u00e9m a ten se neuv\u011b\u0159iteln\u011b rozrostl. Bal\u00ed\u010dky jsou navz\u00e1jem nekompatibiln\u00ed: n\u011bkdo pou\u017e\u00edv\u00e1 promisy, n\u011bkdo async\/await, n\u011bkdo callbacky. Je\u0161t\u011b se p\u00ed\u0161e v r\u016fzn\u00fdch paradigmatech!<\/li>\n<li>To vede k tomu, \u017ee projekt je obt\u00ed\u017en\u00e9 udr\u017eovat. Je t\u011b\u017ek\u00e9 naj\u00edt chybu, pokud nem\u016f\u017eete p\u0159e\u010d\u00edst k\u00f3d.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Co je to Web Assembly?<\/h3>\n<p>\nOdv\u00e1\u017en\u00ed lid\u00e9 z Mozilla Foundation a n\u011bkolika dal\u0161\u00edch spole\u010dnost\u00ed vymysleli n\u011bco, co se naz\u00fdv\u00e1 Web Assembly. Co to je?<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/9ca5b1e0b7646ec7d6fa751d77780b41.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>Je to vestav\u011bn\u00fd virtu\u00e1ln\u00ed stroj v prohl\u00ed\u017ee\u010di, kter\u00fd podporuje bin\u00e1rn\u00ed form\u00e1t.<\/li>\n<li>Bin\u00e1rn\u00ed programy se tam dost\u00e1vaj\u00ed a vykon\u00e1vaj\u00ed se t\u00e9m\u011b\u0159 nativn\u011b, co\u017e znamen\u00e1, \u017ee prohl\u00ed\u017ee\u010di nen\u00ed nutn\u00e9 poka\u017ed\u00e9 analyzovat cel\u00fd \"chaos\" javascriptov\u00e9ho k\u00f3du.<\/li>\n<li>V\u0161echny prohl\u00ed\u017ee\u010de ozn\u00e1mily podporu.<\/li>\n<li>Proto\u017ee je to bajtk\u00f3d, lze napsat kompil\u00e1tor pro jak\u00fdkoli jazyk.<\/li>\n<li>\u010cty\u0159i hlavn\u00ed prohl\u00ed\u017ee\u010de u\u017e p\u0159ich\u00e1zej\u00ed s podporou Web Assembly.<\/li>\n<li>Brzy o\u010dek\u00e1v\u00e1me nativn\u00ed podporu v Go. Tato nov\u00e1 architektura ji\u017e byla p\u0159id\u00e1na: GOARCH=wasm GOOS=js (brzy). Zat\u00edm, jak ch\u00e1pu, nen\u00ed funk\u010dn\u00ed, ale je ozn\u00e1meno, \u017ee to ur\u010dit\u011b bude v Go.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Co d\u011blat nyn\u00ed? GopherJS<\/h3>\n<p>\nDokud nem\u00e1me podporu Web Assembly, existuje takov\u00fd transpiler jako GopherJS.<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/067c1b605b220c4aeed103915daacca4.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>K\u00f3d na Go se transpilu na \"\u010dist\u00fd\" JavaScript.<\/li>\n<li>B\u011b\u017e\u00ed ve v\u0161ech prohl\u00ed\u017ee\u010d\u00edch \u2013 neobsahuje nov\u00e9 funkce, kter\u00e9 podporuj\u00ed pouze modern\u00ed prohl\u00ed\u017ee\u010de (je to Vanilla JS, kter\u00fd b\u011b\u017e\u00ed na \u010demkoli).<\/li>\n<li>Existuje podpora t\u00e9m\u011b\u0159 v\u0161eho, co je v Go, v\u010detn\u011b gorutin a kan\u00e1l\u016f\u2026 \u2013 v\u0161e, co m\u00e1me tak r\u00e1di a co zn\u00e1me.<\/li>\n<li>T\u00e9m\u011b\u0159 cel\u00e1 standardn\u00ed knihovna je podporov\u00e1na, s v\u00fdjimkou t\u011bch bal\u00ed\u010dk\u016f, jejich\u017e podpora v prohl\u00ed\u017ee\u010di ned\u00e1v\u00e1 smysl: syscall, net interakce (existuje net\/http klient, ale nen\u00ed server, a klient je emulov\u00e1n p\u0159es XMLHttpRequest). Celkov\u011b je cel\u00e1 standardn\u00ed knihovna dostupn\u00e1 \u2013 tady je v prohl\u00ed\u017ee\u010di, tady je stdlib Go, kterou m\u00e1me r\u00e1di.<\/li>\n<li>Cel\u00fd ekosyst\u00e9m bal\u00ed\u010dk\u016f v Go, v\u0161echna extern\u00ed \u0159e\u0161en\u00ed (\u0161ablonov\u00e1n\u00ed a dal\u0161\u00ed) lze zkompilovat pomoc\u00ed GopherJS a spustit je v prohl\u00ed\u017ee\u010di.<\/li>\n<\/ul>\n<p>\nZ\u00edsk\u00e1n\u00ed GopherJS je velmi snadn\u00e9 \u2013 je to b\u011b\u017en\u00fd Go bal\u00ed\u010dek. Ud\u011bl\u00e1me go get a m\u00e1me p\u0159\u00edkaz GopherJS, abychom postavili aplikaci:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/4f96f9e437b532f9cb1a4f960a621293.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nTady je takov\u00fd mal\u00fd hello world\u2026<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/e4b56385a6cac97fc75b09584da1bfbb.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n\u2026Obvykl\u00fd Go program, b\u011b\u017en\u00fd bal\u00ed\u010dek fmt ze standardn\u00ed knihovny a Binding Js, abychom m\u011bli p\u0159\u00edstup k API prohl\u00ed\u017ee\u010de. Println bude nakonec p\u0159eveden na console log a prohl\u00ed\u017ee\u010d nap\u00ed\u0161e \"Ahoj gophers\"! Tak snadn\u00e9: d\u011bl\u00e1me GopherJS build \u2013 spou\u0161t\u00edme v prohl\u00ed\u017ee\u010di \u2013 v\u0161e funguje!<\/p>\n<h3>Co je v tuto chv\u00edli k dispozici? Bindings<\/h3>\n<p>\n<img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/6adbc1f604580c3878775c45174444a2.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nExistuj\u00ed bindinky pro v\u0161echny popul\u00e1rn\u00ed js frameworky:<\/p>\n<ul>\n<li>JQuery;<\/li>\n<li>Angular.js;<\/li>\n<li>D3.js pro vytv\u00e1\u0159en\u00ed graf\u016f a pr\u00e1ci s velk\u00fdmi daty;<\/li>\n<li>React.js;<\/li>\n<li>VueJS;<\/li>\n<li>dokonce je podpora Electronu (to znamen\u00e1, \u017ee m\u016f\u017eeme nyn\u00ed ps\u00e1t desktopov\u00e9 aplikace na \"Electronu\");<\/li>\n<li>a to nejz\u00e1bavn\u011bj\u0161\u00ed \u2013 to je WebGL (m\u016f\u017eeme vytv\u00e1\u0159et polygrafick\u00e9 aplikace, v\u010detn\u011b her s 3D grafikou, hudbou a v\u0161emi vychyt\u00e1vkami);<\/li>\n<li>a mnoho dal\u0161\u00edch binding\u016f ke v\u0161em popul\u00e1rn\u00edm javascriptov\u00fdm framework\u016fm a knihovn\u00e1m.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Framework<\/h3>\n<p><\/p>\n<ol>\n<li>Existuje ji\u017e webov\u00fd framework speci\u00e1ln\u011b vyvinut\u00fd pro GopherJS \u2013 Vecty. Je to plnohodnotn\u00e1 alternativa k React.js, ale vyvinut\u00e1 na Go, se specifikac\u00ed GopherJS.<\/li>\n<li>Existuj\u00ed hern\u00ed enginy (n\u00e1hodou!). Na\u0161el jsem dva nejpopul\u00e1rn\u011bj\u0161\u00ed:\n<ul>\n<li>Engo;<\/li>\n<li>Ebiten.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<p>\nUk\u00e1\u017eu p\u00e1r p\u0159\u00edklad\u016f, jak to vypad\u00e1 a co ji\u017e nyn\u00ed lze na Go napsat:<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/53365146c12b320fbf05334bdc6a79e5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nNebo takov\u00e1 varianta (3D st\u0159\u00edle\u010dku jsem nena\u0161el, ale mo\u017en\u00e1 existuje):<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/b1c0a9d6d91ad8a10a9b784cd8c7b1d0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Co nab\u00edz\u00edm?<\/h3>\n<p>\nPr\u00e1v\u011b nyn\u00ed je pr\u016fmysl front-endu v takov\u00e9m stavu, \u017ee se do n\u011bj nyn\u00ed vrhnou v\u0161echny jazyky, kter\u00e9 p\u0159edt\u00edm plakaly nad Javascriptem. Te\u010f se v\u0161echny budou kompilovat do \u201eWeb Assembly\u201c. Co pot\u0159ebujeme, abychom zaujali d\u016fstojn\u00e9 m\u00edsto jako \u201egofe\u0159i\u201c?<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/32c4a03f7a31def833942af6e59c70cb.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nV Go tradi\u010dn\u011b plat\u00ed, \u017ee se jedn\u00e1 o syst\u00e9mov\u00fd programovac\u00ed jazyk, a prakticky neexistuj\u00ed \u017e\u00e1dn\u00e9 knihovny pro pr\u00e1ci s u\u017eivatelsk\u00fdm rozhran\u00edm. N\u011bco existuje, ale je to nap\u016fl opu\u0161t\u011bn\u00e9 a nap\u016fl nefunk\u010dn\u00ed.<\/p>\n<p>A tady se nask\u00fdt\u00e1 dobr\u00e1 p\u0159\u00edle\u017eitost vytvo\u0159it UI knihovny v Go, kter\u00e9 pob\u011b\u017e\u00ed na GopherJS! Kone\u010dn\u011b m\u016f\u017eete napsat sv\u016fj vlastn\u00ed framework! Nastal \u010das, kdy m\u016f\u017eete vytvo\u0159it framework, a bude jedn\u00edm z prvn\u00edch, z\u00edsk\u00e1 brzkou adaptaci a vy se stanete hv\u011bzdou (pokud to bude dobr\u00fd framework).<\/p>\n<p>M\u016f\u017eete adaptovat spoustu r\u016fzn\u00fdch bal\u00ed\u010dk\u016f, kter\u00e9 u\u017e existuj\u00ed v ekosyst\u00e9mu Go, na specifika prohl\u00ed\u017ee\u010de (nap\u0159\u00edklad \u0161ablonovac\u00ed engine). Ty u\u017e stejn\u011b funguj\u00ed, m\u016f\u017eete ud\u011blat pohodln\u00e9 obalov\u00e9 funkce, aby bylo mo\u017en\u00e9 snadno renderovat obsah p\u0159\u00edmo v prohl\u00ed\u017ee\u010di. Plus, m\u016f\u017eete vytvo\u0159it nap\u0159\u00edklad slu\u017ebu, kter\u00e1 um\u00ed renderovat to sam\u00e9 na serveru i na frontendu s vyu\u017eit\u00edm stejn\u00e9ho k\u00f3du \u2013 p\u0159esn\u011b jak to maj\u00ed r\u00e1di frontendov\u00ed v\u00fdvoj\u00e1\u0159i (jen nyn\u00ed v Go).<\/p>\n<p>M\u016f\u017eete napsat hru! Just for fun...<\/p>\n<p>To je v\u0161e.<\/p>\n<p><img decoding=\"async\" alt=\"Alexej Gra\u010dov: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/ba08e0e65de0898e4f53abd00abb6dab.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Ot\u00e1zky<\/h3>\n<p>\n<b>Ot\u00e1zka (d\u00e1le \u2013 O):<\/b> \u2013 P\u00ed\u0161u v Go nebo v Js?<\/p>\n<p><b>AG:<\/b> \u2013 P\u00ed\u0161e\u0161 v Go rutiny, kan\u00e1ly, struktury, embedding \u2013 v\u0161echno\u2026 P\u0159ihla\u0161uje\u0161 se na ud\u00e1lost, p\u0159ed\u00e1v\u00e1\u0161 tam funkci.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Tak\u017ee p\u00ed\u0161u ve \"skute\u010dn\u00e9m\" Js?<\/p>\n<p><b>AG:<\/b> \u2013 Ne, p\u00ed\u0161e\u0161 jakoby v Go a p\u0159ipojuje\u0161 se k API prohl\u00ed\u017ee\u010de (API se p\u0159itom nezm\u011bnilo). M\u016f\u017ee\u0161 napsat sv\u00e9 obalov\u00e9 funkce, aby zpr\u00e1vy chodily do kan\u00e1lu \u2013 to nen\u00ed t\u011b\u017ek\u00e9.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Co mobil?<\/p>\n<p><b>AG:<\/b> \u2013 Ur\u010dit\u011b jsem vid\u011bl: existuj\u00ed bindingy pro patch Cordova, kter\u00e9 Js spou\u0161t\u00ed. V React Native \u2013 nev\u00edm; mo\u017en\u00e1 existuj\u00ed, ale tak\u00e9 nemus\u00ed (nen\u00ed to moc zaj\u00edmav\u00e9). Hern\u00ed engine N-go podporuje tak\u00e9 mobiln\u00ed aplikace \u2013 jak iOS, tak Android.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Ot\u00e1zka ohledn\u011b Web Assembly. M\u00edsto zab\u00edr\u00e1 st\u00e1le v\u00edce, a to i p\u0159es kompresi, \"zipovanost\"... Nezabijeme t\u00edmto zp\u016fsobem sv\u011bt frontendu je\u0161t\u011b v\u00edce?<\/p>\n<p><b>AG:<\/b> \u2013 Web Assembly je bin\u00e1rn\u00ed form\u00e1t, a bin\u00e1rn\u00ed form\u00e1t jako takov\u00fd nem\u016f\u017ee b\u00fdt v fin\u00e1ln\u00edm releasu v\u011bt\u0161\u00ed ne\u017e text... Tla\u010d\u00ed v\u00e1s runtime, ale to je tot\u00e9\u017e, co z\u00e1t\u011b\u017e standardn\u00ed Javascriptov\u00e9 knihovny, kdy\u017e ji nem\u00e1te, proto pou\u017e\u00edv\u00e1me n\u011bco jako Lodash. Nev\u00edm, kolik m\u00edsta Lodash zab\u00edr\u00e1.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Opraven\u011b m\u00e9n\u011b, ne\u017e runtime...<\/p>\n<p><b>AG:<\/b> \u2013 Na \"\u010dist\u00e9m\" Javascriptu?<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Ano. My ho komprimujeme p\u0159ed t\u00edm, ne\u017e ho pos\u00edl\u00e1me...<\/p>\n<p><b>AG:<\/b> \u2013 Ale to je text\u2026 Obecn\u011b, megabajt \u2013 to je jako dost, ale to je \u2013 v\u0161e (m\u00e1\u0161 cel\u00fd runtime). Pak nap\u00ed\u0161e\u0161 svou obchodn\u00ed logiku, kter\u00e1 zv\u00fd\u0161\u00ed tv\u016fj binary o 1 %. Zat\u00edm nevid\u00edm, \u017ee by to zab\u00edjelo frontend. T\u00edm sp\u00ed\u0161 Web Assembly bude b\u011b\u017eet rychleji ne\u017e Javascript z o\u010dividn\u00e9ho d\u016fvodu \u2013 nemus\u00ed se parsinovati.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Zat\u00edm sporn\u00fd bod\u2026 Je\u0161t\u011b neexistuje \u017e\u00e1dn\u00e1 standardn\u00ed implementace \u201eVasmy\u201c (Web Assembly), abychom mohli jednozna\u010dn\u011b soudit. Konceptu\u00e1ln\u011b \u2013 ano: v\u0161ichni ch\u00e1peme, \u017ee binary by m\u011bl b\u00fdt rychlej\u0161\u00ed, ale sou\u010dasn\u00e1 implementace stejn\u00e9ho V8 je velmi efektivn\u00ed.<\/p>\n<p><b>AG:<\/b> \u2013 Ano.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Kompilace tam opravdu funguje velmi skv\u011ble a nen\u00ed jist\u00e9, \u017ee bude velk\u00e1 v\u00fdhoda.<\/p>\n<p><b>AG:<\/b> \u2013 Web Assembly tak\u00e9 d\u011blaj\u00ed velc\u00ed fraje\u0159i.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Zat\u00edm se mi zd\u00e1, \u017ee je t\u011b\u017ek\u00e9 soudit o Web Assembly. U\u017e kolik let se o tom mluv\u00ed, a skute\u010dn\u00fdch dosa\u017een\u00ed, kter\u00e9 bys mohl osahat, je m\u00e1lo.<\/p>\n<p><b>AG:<\/b> \u2013 Mo\u017en\u00e1. Uvid\u00edme.<\/p>\n<p><b>Ot\u00e1zka:<\/b> \u2013 Nem\u00e1me probl\u00e9my na backendu\u2026 Mo\u017en\u00e1 tyto probl\u00e9my nechat na frontendu? Pro\u010d tam zasahovat?<\/p>\n<p><b>AG:<\/b> \u2013 Mus\u00edme udr\u017eovat t\u00fdm frontendov\u00fdch v\u00fdvoj\u00e1\u0159\u016f.<\/p>\n<p><center><div class=\"youtube-placeholder\" data-id=\"xF2xUKIk2MQ\" onclick=\"loadVideo(this)\">\r\n        <img decoding=\"async\" src=\"https:\/\/img.youtube.com\/vi\/xF2xUKIk2MQ\/hqdefault.jpg\" alt=\"P\u0159ehr\u00e1t video\" loading=\"lazy\" width=\"480\" height=\"360\" style=\"width:100%;height:auto;\">\r\n        <div class=\"play-button\"><\/div>\r\n    <\/div><\/center><\/p>\n<h3>Mal\u00e1 reklama \ud83d\ude42<\/h3>\n<p>\nD\u011bkujeme, \u017ee s n\u00e1mi z\u016fst\u00e1v\u00e1te. L\u00edb\u00ed se v\u00e1m na\u0161e \u010dl\u00e1nky? Chcete vid\u011bt v\u00edce zaj\u00edmav\u00fdch materi\u00e1l\u016f? Podpo\u0159te n\u00e1s objedn\u00e1vkou nebo doporu\u010den\u00edm zn\u00e1m\u00fdm, <noindex><a rel=\"nofollow\" href=\"https:\/\/ua-hosting.company\/cloudvps\/nl\">cloudov\u00e9 VPS pro v\u00fdvoj\u00e1\u0159e od 4,99 $<\/a><\/noindex>, <b>unik\u00e1tn\u00ed alternativa entry-level server\u016f, kterou jsme pro v\u00e1s vymysleli:<\/b> <noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/company\/ua-hosting\/blog\/347386\/\">V\u0161echny pravdy o VPS (KVM) E5-2697 v3 (6 jader) 10GB DDR4 480GB SSD 1Gbps od 19 $ nebo jak spr\u00e1vn\u011b rozd\u011blit server?<\/a><\/noindex> (k dispozici varianty s RAID1 a RAID10, a\u017e 24 jader a a\u017e 40GB DDR4).<\/p>\n<p><b>Dell R730xd je dvakr\u00e1t levn\u011bj\u0161\u00ed v datov\u00e9m centru Equinix Tier IV v Amsterdamu?<\/b> Jen u n\u00e1s <b><noindex><a rel=\"nofollow\" href=\"https:\/\/ua-hosting.company\/serversnl\">2 x Intel TetraDeca-Core Xeon 2x E5-2697v3 2.6GHz 14C 64GB DDR4 4x960GB SSD 1Gbps 100 TB od 199 $<\/a><\/noindex> v Nizozemsku! <b>Dell R420 \u2014 2x E5-2430 2.2GHz 6C 128GB DDR3 2x960GB SSD 1Gbps 100TB \u2014 od 99 $!<\/b><\/b> \u010ct\u011bte o tom <noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/company\/ua-hosting\/blog\/329618\/\">Jak postavit infrastrukturu podnikov\u00e9 t\u0159\u00eddy s pou\u017eit\u00edm server\u016f Dell R730xd E5-2650 v4 v hodnot\u011b 9000 eur za pakatel?<\/a><\/noindex><br \/>\n<br \/>Zdroj: <a content=\"nofollow\" rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/ua-hosting\/blog\/489636\/\">habr.com<\/a> <\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"<p>Kyiv Go Meetup May 2018: \u0412\u0435\u0434\u0443\u0449\u0438\u0439: \u2013 \u0412\u0441\u0435\u043c \u043f\u0440\u0438\u0432\u0435\u0442! \u0421\u043f\u0430\u0441\u0438\u0431\u043e, \u0447\u0442\u043e \u0432\u044b \u0437\u0434\u0435\u0441\u044c \u0441\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c! \u0421\u0435\u0433\u043e\u0434\u043d\u044f \u0443 \u043d\u0430\u0441 \u0434\u0432\u0430 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u043f\u0438\u043a\u0435\u0440\u0430 \u2013 \u041b\u0451\u0448\u0430 \u0438 \u0412\u0430\u043d\u044f. \u0411\u0443\u0434\u0435\u0442 \u0435\u0449\u0451 \u0434\u0432\u0430, \u0435\u0441\u043b\u0438 \u0443 \u043d\u0430\u0441 \u0445\u0432\u0430\u0442\u0438\u0442 \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041f\u0435\u0440\u0432\u044b\u0439 \u0441\u043f\u0438\u043a\u0435\u0440 \u2013 \u0410\u043b\u0435\u043a\u0441\u0435\u0439 \u0413\u0440\u0430\u0447\u0451\u0432, \u043e\u043d \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0435\u0442 \u043d\u0430\u043c \u043e GopherJS. \u0410\u043b\u0435\u043a\u0441\u0435\u0439 \u0413\u0440\u0430\u0447\u0451\u0432 (\u0434\u0430\u043b\u0435\u0435 \u2013 \u0410\u0413): \u2013 \u042f \u2013 Go-\u0434\u0435\u0432\u0435\u043b\u043e\u043f\u0435\u0440, \u0438 \u044f \u043f\u0438\u0448\u0443 \u0432\u0435\u0431-\u0441\u0435\u0440\u0432\u0438\u0441\u044b [&hellip;]<\/p>\n","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"author":1,"featured_media":71629,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[688],"tags":[],"class_list":["post-71628","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-administrirovanie"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.3 - aioseo.com -->\n\t<meta name=\"description\" content=\"Kyiv Go Meetup May 2018: \u0412\u0435\u0434\u0443\u0449\u0438\u0439: \u2013 \u0412\u0441\u0435\u043c.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Yuri Gagarin\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/aleksej-grachyov-go-frontend\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.3\" \/>\n\t\t<meta property=\"og:locale\" content=\"cs_CZ\" \/>\n\t\t<meta property=\"og:site_name\" content=\"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"\ud83e\udd47\u0410\u043b\u0435\u043a\u0441\u0435\u0439 \u0413\u0440\u0430\u0447\u0451\u0432: Go Frontend | ProHoster\" \/>\n\t\t<meta property=\"og:description\" content=\"Kyiv Go Meetup May 2018: \u0412\u0435\u0434\u0443\u0449\u0438\u0439: \u2013 \u0412\u0441\u0435\u043c.\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/aleksej-grachyov-go-frontend\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2020-02-27T05:51:24+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2020-03-03T13:14:16+00:00\" \/>\n\t\t<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"\ud83e\udd47Alexey Gra\u010dev: Go Frontend | ProHoster","description":"Kyiv Go Meetup kv\u011bten 2018: Moder\u00e1tor: \u2013 V\u0161ichni.","canonical_url":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/aleksej-grachyov-go-frontend","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"cs_CZ","og:site_name":"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b","og:type":"article","og:title":"\ud83e\udd47\u0410\u043b\u0435\u043a\u0441\u0435\u0439 \u0413\u0440\u0430\u0447\u0451\u0432: Go Frontend | ProHoster","og:description":"Kyiv Go Meetup May 2018: \u0412\u0435\u0434\u0443\u0449\u0438\u0439: \u2013 \u0412\u0441\u0435\u043c.","og:url":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/aleksej-grachyov-go-frontend","og:image":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:secure_url":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:width":350,"og:image:height":350,"article:published_time":"2020-02-27T05:51:24+00:00","article:modified_time":"2020-03-03T13:14:16+00:00","article:publisher":"https:\/\/www.facebook.com\/prohoster","article:author":"https:\/\/www.facebook.com\/prohoster"},"aioseo_meta_data":{"post_id":"71628","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":null,"breadcrumb_settings":null,"limit_modified_date":false,"reviewed_by":null,"ai":null,"created":"2021-02-28 18:58:26","updated":"2022-09-27 20:58:26","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"gt_translate_keys":[{"key":"link","format":"url"}],"_links":{"self":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/71628","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/comments?post=71628"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/71628\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media\/71629"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media?parent=71628"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/categories?post=71628"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/tags?post=71628"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}