{"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\/hu\/blog\/administrirovanie\/aleksej-grachyov-go-frontend","title":{"rendered":"Alekszej Gracsev: Go Frontend","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p>Kyiv Go Meetup 2018. m\u00e1jus:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/9974ab1db5347a41e4ec5110c3d2ef56.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>H\u00e1zigazda:<\/b> \u2013 Mindenki, \u00fcdv\u00f6zl\u00f6m! K\u00f6sz\u00f6n\u00f6m, hogy itt vagytok! Ma k\u00e9t hivatalos el\u0151ad\u00f3nk van \u2013 Alex \u00e9s Vanya. Lesz m\u00e9g k\u00e9t m\u00e1sik, ha lesz id\u0151nk. Az els\u0151 el\u0151ad\u00f3 \u2013 Alexey Grachev, \u0151 fog besz\u00e9lni a GopherJS-r\u0151l.<\/p>\n<p><b>Alexey Grachev (a tov\u00e1bbiakban \u2013 AG):<\/b> \u2013 \u00c9n Go-fejleszt\u0151 vagyok, webszolg\u00e1ltat\u00e1sokat \u00edrok Go nyelven. N\u00e9ha bele kell ny\u00falnom a frontendbe, n\u00e9ha k\u00e9zzel kell dolgoznom. Szeretn\u00e9m megosztani veletek a tapasztalataimat \u00e9s a Go frontendben val\u00f3 haszn\u00e1lat\u00e1nak kutat\u00e1sait.<\/p>\n<p>A legenda \u00fagy sz\u00f3l: el\u0151sz\u00f6r besz\u00e9l\u00fcnk arr\u00f3l, mi\u00e9rt szeretn\u00e9nk Go-t futtatni a frontendben, majd arr\u00f3l, hogyan tehetj\u00fck ezt. K\u00e9t \u00fat van \u2013 Web Assembly \u00e9s GopherJS. Megn\u00e9zz\u00fck, milyen \u00e1llapotban vannak ezek a megold\u00e1sok \u00e9s mit lehet vel\u00fck kezdeni.<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<h3>Mi a probl\u00e9ma a frontenddel?<\/h3>\n<p>\nMindenki egyet\u00e9rtene abban, hogy minden rendben van a frontenddel?<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/065119e699053306072b1d7aa3183b34.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nKev\u00e9s teszt? Lass\u00fa build? \u00d6kosziszt\u00e9ma? Rendben.<\/p>\n<p>A frontendre vonatkoz\u00f3an tetszik egy id\u00e9zet, amit az egyik frontend fejleszt\u0151 mondott a k\u00f6nyv\u00e9ben:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/e69eba4fc073c0b59789859c94ba29f2.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nA Javascriptben nincs t\u00edpuskezel\u0151 rendszer. Most probl\u00e9m\u00e1kat fogok eml\u00edteni, amelyekkel a munk\u00e1m sor\u00e1n tal\u00e1lkoztam, \u00e9s elmagyar\u00e1zom, hogyan oldj\u00e1k meg ezeket.<\/p>\n<p>A Javascript t\u00edpuskezel\u0151 rendszert aligha nevezhetj\u00fck rendszernek \u2013 l\u00e9teznek stringek, amelyek az objektumok t\u00edpus\u00e1t jel\u00f6lik, de val\u00f3j\u00e1ban semmi k\u00f6z\u00fck a t\u00edpusokhoz. Ezt a probl\u00e9m\u00e1t a TypeScript (a Javascript kiterjeszt\u00e9se) \u00e9s a Flow (a Javascript t\u00edpusok statikus ellen\u0151rz\u0151je) oldotta meg. A frontend m\u00e1r eljutott a Javascript gyenge t\u00edpuskezel\u0151 rendszer\u00e9nek a probl\u00e9m\u00e1j\u00e1nak a megold\u00e1s\u00e1ig.<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/257542cbfd2e316fbe0a0033056fff6f.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nA b\u00f6ng\u00e9sz\u0151ben gyakorlatilag nincs standard k\u00f6nyvt\u00e1r \u2013 vannak be\u00e9p\u00edtett objektumok \u00e9s \"var\u00e1zslatos\" funkci\u00f3k a b\u00f6ng\u00e9sz\u0151kben. De a Javascriptben alapvet\u0151en nincs standard k\u00f6nyvt\u00e1r. Ezt a probl\u00e9m\u00e1t egykor a jQuery oldotta meg (mindenki haszn\u00e1lta a jQuery-t minden protot\u00edpussal, seg\u00edt\u0151kkel \u00e9s a m\u0171k\u00f6d\u00e9shez sz\u00fcks\u00e9ges funkci\u00f3kkal). Ma m\u00e1r mindenki a Lodash-ot haszn\u00e1lja:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/4eae8a8f19776028bd88fe8f7a751605.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nCallback hell. Gondolom, mindannyian l\u00e1ttunk Javascript k\u00f3dot k\u00f6r\u00fclbel\u00fcl 5 \u00e9vvel ezel\u0151tt, \u00e9s az \u201et\u00e9sztaszer\u0171\u201d volt, tele hihetetlen \u00f6sszekusz\u00e1lt callback-ekkel. Ma m\u00e1r ezt a probl\u00e9m\u00e1t megoldott\u00e1k (az ES-15 vagy ES-16 megjelen\u00e9s\u00e9vel), bevezett\u00e9k a Javascriptbe a promise-okat, \u00e9s mindenki kicsit k\u00f6nnyebben l\u00e9legzett egy ideig.<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/96c574a880ad97e0802ae3006a60cee6.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nAm\u00edg meg nem \u00e9rkezett a Promise hell... Nem tudom, hogyan siker\u00fcl a frontend iparnak, de mindig valamilyen furcsas\u00e1gba keverik magukat. A promise-okb\u00f3l is megoldott\u00e1k a hell-t. Azt\u00e1n megoldott\u00e1k ezt a probl\u00e9m\u00e1t az \u00faj primit\u00edv bevezet\u00e9s\u00e9vel \u2013 async\/await:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/7c0679babbea4583de924292893d805c.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nAz aszinkronit\u00e1s probl\u00e9ma megoldva. Az async\/await el\u00e9g n\u00e9pszer\u0171 primit\u00edv k\u00fcl\u00f6nb\u00f6z\u0151 nyelvekben. A Pythonban \u00e9s m\u00e1sokban is van egy ilyen megk\u00f6zel\u00edt\u00e9s \u2014 el\u00e9g j\u00f3. A probl\u00e9ma megoldva.<\/p>\n<p>Melyik probl\u00e9ma maradt megoldatlan? A keretrendszerek exponenci\u00e1lisan n\u00f6vekv\u0151 bonyolults\u00e1ga, az \u00f6kosziszt\u00e9ma bonyolults\u00e1ga \u00e9s maguk a programok.<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/617fbc72e9e059bf608a48c84c5328f9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>A Javascript szintaxisa kicsit furcsa. Mindannyian ismerj\u00fck a t\u00f6mb\u00f6k \u00e9s objektumok \u00f6sszead\u00e1s\u00e1val kapcsolatos probl\u00e9m\u00e1kat \u00e9s m\u00e1s tr\u00fckk\u00f6ket.<\/li>\n<li>A Javascript t\u00f6bbparadigm\u00e1s. Ez k\u00fcl\u00f6n\u00f6sen aktu\u00e1lis rendszer, amikor az \u00f6kosziszt\u00e9ma nagyon nagy:\n<ul>\n<li>mindenki k\u00fcl\u00f6nb\u00f6z\u0151 st\u00edlusokban \u00edr \u2014 valaki struktur\u00e1lisan, valaki funkcion\u00e1lisan, k\u00fcl\u00f6nb\u00f6z\u0151 fejleszt\u0151k m\u00e1sk\u00e9pp \u00edrnak;<\/li>\n<li>k\u00fcl\u00f6nb\u00f6z\u0151 csomagok (packages) k\u00fcl\u00f6nb\u00f6z\u0151 paradigm\u00e1kat haszn\u00e1lnak, amikor k\u00fcl\u00f6nb\u00f6z\u0151 csomagokat haszn\u00e1lsz;<\/li>\n<li>nagyon sok \u201esz\u00f3rakoz\u00e1s\u201d van a funkcion\u00e1lis programoz\u00e1ssal a Javascriptban \u2014 megjelent a rambda k\u00f6nyvt\u00e1r, \u00e9s most senki sem tudja elolvasni az ebben a k\u00f6nyvt\u00e1rban \u00edrt programokat.<\/li>\n<\/ul>\n<p>\n<\/li>\n<li>Mindez nagy hat\u00e1ssal van az \u00f6kosziszt\u00e9m\u00e1ra, \u00e9s hihetetlen\u00fcl megn\u0151tt. A csomagok nem kompatibilisek egym\u00e1ssal: valaki \u00edg\u00e9reteken alapul, valaki async\/await-t, valaki callback-eket haszn\u00e1l. R\u00e1ad\u00e1sul k\u00fcl\u00f6nb\u00f6z\u0151 paradigm\u00e1kban \u00edrnak!<\/li>\n<li>Ez oda vezet, hogy a projektet neh\u00e9z karbantartani. Neh\u00e9z hib\u00e1kat tal\u00e1lni, ha nem tudod elolvasni a k\u00f3dot.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Mi az a Web Assembly?<\/h3>\n<p>\nA b\u00e1tor fi\u00fak a Mozilla Alap\u00edtv\u00e1nyt\u00f3l \u00e9s m\u00e1s c\u00e9gekt\u0151l kital\u00e1lt\u00e1k azt, amit Web Assembly-nek h\u00edvunk. Mi ez?<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/9ca5b1e0b7646ec7d6fa751d77780b41.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>Ez egy b\u00f6ng\u00e9sz\u0151kbe be\u00e9p\u00edtett virtu\u00e1lis g\u00e9p, ami t\u00e1mogatja a bin\u00e1ris form\u00e1tumot.<\/li>\n<li>A bin\u00e1ris programok odaker\u00fclnek, gyakorlatilag nat\u00edvan futnak, ami azt jelenti, hogy a b\u00f6ng\u00e9sz\u0151nek nem kell minden alkalommal az \u00f6sszes Javascript k\u00f3dot \"parse\"-olni.<\/li>\n<li>Minden b\u00f6ng\u00e9sz\u0151 bejelentette a t\u00e1mogat\u00e1st.<\/li>\n<li>Mivel ez byte-k\u00f3d, b\u00e1rmely nyelvhez \u00edrhatsz ford\u00edt\u00f3t.<\/li>\n<li>A n\u00e9gy legfontosabb b\u00f6ng\u00e9sz\u0151 m\u00e1r t\u00e1mogatja a Web Assembly-t.<\/li>\n<li>Hamarosan nat\u00edv t\u00e1mogat\u00e1st v\u00e1runk a Go-ban. Ez az \u00faj architekt\u00fara m\u00e1r hozz\u00e1 lett adva: GOARCH=wasm GOOS=js (hamarosan). Jelenleg, amennyire tudom, nem funkcion\u00e1lis, de van kijelent\u00e9s arr\u00f3l, hogy ez biztosan lesz a Go-ban.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Mit tegy\u00fcnk most? GopherJS<\/h3>\n<p>\nM\u00edg nincs Web Assembly t\u00e1mogat\u00e1sunk, van egy transzpiler, mint a GopherJS.<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/067c1b605b220c4aeed103915daacca4.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<ul>\n<li>A Go k\u00f3d transzpilez\u0151dik \"tiszta\" Javascript-ra.<\/li>\n<li>Minden b\u00f6ng\u00e9sz\u0151ben fut \u2014 nincs \u00faj funkci\u00f3, amit csak a modern b\u00f6ng\u00e9sz\u0151k t\u00e1mogatnak (ez Vanilla JS, ami b\u00e1rmin m\u0171k\u00f6dik).<\/li>\n<li>A Go szinte minden, bele\u00e9rtve a goroutine-okat \u00e9s a csatorn\u00e1kat is, t\u00e1mogatott\u2026 \u2013 mindaz, amit olyan nagyon szeret\u00fcnk \u00e9s ismer\u00fcnk.<\/li>\n<li>Majdnem az \u00f6sszes standard k\u00f6nyvt\u00e1r t\u00e1mogatott, kiv\u00e9ve azokat a csomagokat, amelyeknek nincs \u00e9rtelme a b\u00f6ng\u00e9sz\u0151ben t\u00e1mogatni: syscall, a h\u00e1l\u00f3zati interakci\u00f3k (van net\/http kliens, de nincs szerver, a kliens pedig XMLHttpRequest-en kereszt\u00fcl van emul\u00e1lva). \u00d6sszess\u00e9g\u00e9ben az \u00f6sszes standard k\u00f6nyvt\u00e1r el\u00e9rhet\u0151 \u2013 itt van a b\u00f6ng\u00e9sz\u0151ben, itt van a Go stdlib, amit szeret\u00fcnk.<\/li>\n<li>A Go csomag teljes \u00f6kosziszt\u00e9m\u00e1ja, minden harmadik f\u00e9lt\u0151l sz\u00e1rmaz\u00f3 megold\u00e1s (sablonoz\u00e1s stb.) GopherJS seg\u00edts\u00e9g\u00e9vel leford\u00edthat\u00f3 \u00e9s a b\u00f6ng\u00e9sz\u0151ben futtathat\u00f3.<\/li>\n<\/ul>\n<p>\nA GopherJS beszerz\u00e9se nagyon egyszer\u0171 \u2013 ez egy szok\u00e1sos Go csomag. Csin\u00e1ljuk a go get parancsot, \u00e9s van egy GopherJS parancsunk az alkalmaz\u00e1s \u00e9p\u00edt\u00e9s\u00e9hez:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/4f96f9e437b532f9cb1a4f960a621293.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nItt van egy ilyen kis hello world...<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/e4b56385a6cac97fc75b09584da1bfbb.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n\u2026Egy szok\u00e1sos Go program, a szok\u00e1sos fmt csomag a standard k\u00f6nyvt\u00e1rb\u00f3l \u00e9s a Js Binding, hogy el\u00e9rj\u00fck a b\u00f6ng\u00e9sz\u0151 API-j\u00e1t. A Println v\u00e9g\u00fcl console log-ra lesz \u00e1tkonvert\u00e1lva, \u00e9s a b\u00f6ng\u00e9sz\u0151 ki\u00edrja, hogy \u201cHello gophers\u201d! \u00cdgy egyszer\u0171: csin\u00e1lunk egy GopherJS build-et \u2013 elind\u00edtjuk a b\u00f6ng\u00e9sz\u0151ben \u2013 minden m\u0171k\u00f6dik!<\/p>\n<h3>Jelenleg mi \u00e1ll rendelkez\u00e9sre? Bindings<\/h3>\n<p>\n<img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/6adbc1f604580c3878775c45174444a2.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nMinden n\u00e9pszer\u0171 js-keretrendszerhez van binding:<\/p>\n<ul>\n<li>JQuery;<\/li>\n<li>Angular.js;<\/li>\n<li>D3.js grafikonok k\u00e9sz\u00edt\u00e9s\u00e9hez \u00e9s nagy adatokkal val\u00f3 munk\u00e1hoz;<\/li>\n<li>React.js;<\/li>\n<li>VueJS;<\/li>\n<li>m\u00e9g az Electron t\u00e1mogat\u00e1sa is van (teh\u00e1t m\u00e1r most is \u00edrhatsz desktop alkalmaz\u00e1sokat \u2018Electron\u2019-ra);<\/li>\n<li>\u00e9s a legsz\u00f3rakoztat\u00f3bb a WebGL (teljesen grafik\u00e1val ell\u00e1tott alkalmaz\u00e1sokat, bele\u00e9rtve a 3D-s j\u00e1t\u00e9kokat, zen\u00e9t \u00e9s minden egyebet is k\u00e9sz\u00edthet\u00fcnk);<\/li>\n<li>\u00e9s sok m\u00e1s binding a n\u00e9pszer\u0171 javascript-keretrendszerekhez \u00e9s k\u00f6nyvt\u00e1rakhoz.<\/li>\n<\/ul>\n<p><\/p>\n<h3>Framework<\/h3>\n<p><\/p>\n<ol>\n<li>M\u00e1r l\u00e9tezik egy GopherJS-re kifejezetten kifejlesztett web-keretrendszer \u2013 Vecty. Ez a teljes \u00e9rt\u00e9k\u0171 React.js anal\u00f3gja, csak Go nyelven, a GopherJS saj\u00e1toss\u00e1gaival.<\/li>\n<li>Van j\u00e1t\u00e9kcsomag (meglep\u0151en!). K\u00e9t legn\u00e9pszer\u0171bbet tal\u00e1ltam:\n<ul>\n<li>Engo;<\/li>\n<li>Ebiten.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<p>\nBemutatok n\u00e9h\u00e1ny p\u00e9ld\u00e1t, hogyan n\u00e9z ki ez, \u00e9s mit lehet m\u00e1r most \u00edrni Go-ban:<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/53365146c12b320fbf05334bdc6a79e5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nVagy egy ilyen verzi\u00f3 (3D-s l\u00f6v\u00f6ld\u00f6z\u0151s j\u00e1t\u00e9kot nem tal\u00e1ltam, de tal\u00e1n l\u00e9tezik):<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/b1c0a9d6d91ad8a10a9b784cd8c7b1d0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Mit aj\u00e1nlok?<\/h3>\n<p>\nJelenleg a frontend ipar\u00e1g ilyen helyzetben van, hogy minden olyan nyelv, amely eddig s\u00edrt a Javascript miatt, most be fog ugrani. Mostant\u00f3l mindenki a \u2018Web Assembly\u2019-be fog fordulni. Mire van sz\u00fcks\u00e9g\u00fcnk, hogy m\u00e9lt\u00f3 helyet szerezz\u00fcnk ott \u2018goferekk\u00e9nt\u2019?<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/32c4a03f7a31def833942af6e59c70cb.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nA Go nyelvr\u0151l hagyom\u00e1nyosan \u00fagy tartj\u00e1k, hogy ez egy rendszerszint\u0171 programoz\u00e1si nyelv, \u00e9s gyakorlatilag nincsenek k\u00f6nyvt\u00e1rak a UI-hoz val\u00f3 munk\u00e1ra. Van valami, de f\u00e9lig elhagyott \u00e9s f\u00e9lig nem funkcion\u00e1lis.<\/p>\n<p>\u00c9s most itt a j\u00f3 alkalom, hogy UI k\u00f6nyvt\u00e1rakat k\u00e9sz\u00edts\u00fcnk Go-ban, amelyek a GopherJS-en futnak! V\u00e9gre elk\u00e9sz\u00edtheted a saj\u00e1t keretrendszeredet! El\u00e9rkezett az id\u0151, hogy meg\u00edrd a keretet, \u00e9s az egyik legels\u0151 lesz, \u00edgy korai adapt\u00e1ci\u00f3t kap, \u00e9s te leszel a szt\u00e1r (ha j\u00f3 keretrendszer lesz).<\/p>\n<p>Sz\u00e1mos k\u00fcl\u00f6nb\u00f6z\u0151 csomagot lehet adapt\u00e1lni, amelyek m\u00e1r l\u00e9teznek a Go \u00f6kosziszt\u00e9m\u00e1ban, a b\u00f6ng\u00e9sz\u0151 saj\u00e1toss\u00e1gainak megfelel\u0151en (p\u00e9ld\u00e1ul sablonszerkeszt\u0151). Ezek m\u00e1r m\u0171k\u00f6dnek, el lehet k\u00e9sz\u00edteni k\u00e9nyelmes csomagol\u00e1sokat, hogy k\u00f6nnyen lehessen tartalmat renderelni k\u00f6zvetlen\u00fcl a b\u00f6ng\u00e9sz\u0151ben. Tov\u00e1bb\u00e1 l\u00e9trehozhatsz p\u00e9ld\u00e1ul egy szolg\u00e1ltat\u00e1st, amely k\u00e9pes ugyanazt renderelni a szerveren \u00e9s a frontend-en, ugyanazzal a k\u00f3ddal \u2013 mindez \u00fagy, ahogy a frontend fejleszt\u0151k szeretik (csak most Go-ban).<\/p>\n<p>\u00cdrhatsz egy j\u00e1t\u00e9kot! Csak sz\u00f3rakoz\u00e1sb\u00f3l\u2026<\/p>\n<p>N\u00e1lam ennyi.<\/p>\n<p><img decoding=\"async\" alt=\"Alekszej Gracsev: Go Frontend\" src=\"\/wp-content\/uploads\/2020\/02\/ba08e0e65de0898e4f53abd00abb6dab.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>K\u00e9rd\u00e9sek<\/h3>\n<p>\n<b>K\u00e9rd\u00e9s (a tov\u00e1bbiakban \u2013 K):<\/b> \u2013 Go-n \u00edrok vagy Js-en?<\/p>\n<p><b>AG:<\/b> \u2013 Go rutint, csatorn\u00e1kat, strukt\u00far\u00e1kat, embeddinget \u00edrsz \u2013 mindent\u2026 K\u00f6zvet\u00edtesz egy esem\u00e9nyre, \u00e1tadsz egy f\u00fcggv\u00e9nyt.<\/p>\n<p><b>K:<\/b> \u2013 Teh\u00e1t \u00e9n \u201etiszta\u201d Js-en \u00edrok?<\/p>\n<p><b>AG:<\/b> \u2013 Nem, mintha Go-n \u00edrn\u00e1l, \u00e9s csatlakozol a b\u00f6ng\u00e9sz\u0151 API-j\u00e1hoz (az API egy\u00e9bk\u00e9nt nem v\u00e1ltozott). \u00cdrhatsz saj\u00e1t csomagokat, hogy \u00fczenetek \u00e9rkezzenek a csatorn\u00e1ra \u2013 ez nem neh\u00e9z.<\/p>\n<p><b>K:<\/b> \u2013 Mi a helyzet a mobiltelefonokkal?<\/p>\n<p><b>AG:<\/b> \u2013 Pontosan l\u00e1ttam: vannak k\u00f6t\u00e9sek a Cordova patch-hez, amelyeket a Js ind\u00edt. A React Native-r\u00f3l nem tudom; lehet, hogy van, lehet, hogy nincs (nem igaz\u00e1n \u00e9rdekeltem). Az N-go j\u00e1t\u00e9kmotor t\u00e1mogatja a mobilalkalmaz\u00e1sokat \u2013 mind az iOs-t, mind az Androidot.<\/p>\n<p><b>K:<\/b> \u2013 K\u00e9rd\u00e9s a Web Assembly-r\u0151l. Egyre t\u00f6bb helyet foglal el, a t\u00f6m\u00f6r\u00edt\u00e9s ellen\u00e9re, \u201ezip-elt\u201d\u2026 Nem \u00f6lj\u00fck meg ezzel m\u00e9g jobban a frontend vil\u00e1g\u00e1t?<\/p>\n<p><b>AG:<\/b> \u2013 A Web Assembly egy bin\u00e1ris form\u00e1tum, \u00e9s a bin\u00e1ris alap\u00e9rtelmez\u00e9s szerint nem lehet nagyobb, mint a sz\u00f6veg a v\u00e9gs\u0151 kiad\u00e1sban\u2026 A fut\u00e1si id\u0151t szeretn\u00e9d magaddal hozni, de ez ugyanolyan, mint a Javascript szabv\u00e1nyos k\u00f6nyvt\u00e1r\u00e1nak magaddal hoz\u00e1sa, amikor az nincs, ez\u00e9rt haszn\u00e1lunk valamilyen Lodash-t. Nem tudom, hogy a Lodash mennyi helyet foglal.<\/p>\n<p><b>K:<\/b> \u2013 Nyilv\u00e1nval\u00f3an kevesebb, mint a fut\u00e1si id\u0151\u2026<\/p>\n<p><b>AG:<\/b> \u2013 A \u201etiszta\u201d Javascript-en?<\/p>\n<p><b>K:<\/b> \u2013 Igen. M\u00e1r t\u00f6m\u00f6r\u00edtj\u00fck, miel\u0151tt elk\u00fcldj\u00fck\u2026<\/p>\n<p><b>AG:<\/b> \u2013 De ez egy sz\u00f6veg\u2026 Sz\u00f3val, egy megab\u00e1jt \u2013 ez nagyj\u00e1b\u00f3l sok, de ez \u2013 az eg\u00e9sz (neked van minden fut\u00e1si id\u0151d). Azt\u00e1n \u00edrod a saj\u00e1t \u00fczleti logik\u00e1dat, amely 1%-kal n\u00f6veli a bin\u00e1rist. Egyel\u0151re nem l\u00e1tom, hogy ez meg\u00f6ln\u00e9 a frontendot. F\u0151leg, hogy a Web Assembly gyorsabban fog m\u0171k\u00f6dni, mint a Javascript, nyilv\u00e1nval\u00f3 okb\u00f3l \u2013 nem kell elemezni.<\/p>\n<p><b>K:<\/b> \u2013 M\u00e9g vita alatt \u00e1ll\u2026 M\u00e9g nincs egy olyan etalon megval\u00f3s\u00edt\u00e1s a \"Vasm\u00e1val\" (Web Assembly), amib\u0151l egy\u00e9rtelm\u0171en lehetne \u00edt\u00e9lni. Konceptu\u00e1lisan \u2013 igen: mindannyian \u00e9rtj\u00fck, hogy a bin\u00e1risnak gyorsabbnak kell lennie, de a jelenlegi V8 megval\u00f3s\u00edt\u00e1s nagyon hat\u00e9kony.<\/p>\n<p><b>AG:<\/b> \u2013 Igen.<\/p>\n<p><b>K:<\/b> \u2013 A ford\u00edt\u00e1s ott val\u00f3ban nagyon j\u00f3l m\u0171k\u00f6dik, \u00e9s nem biztos, hogy nagy el\u0151nye lesz.<\/p>\n<p><b>AG:<\/b> \u2013 A Web Assembly-t is komoly c\u00e9gek k\u00e9sz\u00edtik.<\/p>\n<p><b>K:<\/b> \u2013 Egyel\u0151re, \u00fagy \u00e9rzem, m\u00e9g neh\u00e9z meg\u00edt\u00e9lni a Web Assembly-t. M\u00e1r h\u00e1ny \u00e9ve besz\u00e9lget\u00fcnk r\u00f3la, de val\u00f3s, k\u00e9zzelfoghat\u00f3 eredm\u00e9nyekb\u0151l viszont kev\u00e9s van.<\/p>\n<p><b>AG:<\/b> \u2013 Lehets\u00e9ges. Majd megl\u00e1tjuk.<\/p>\n<p><b>K:<\/b> \u2013 Nincs probl\u00e9m\u00e1nk a backenddel\u2026 Tal\u00e1n ezeket a probl\u00e9m\u00e1kat a frontendben kellene hagyni? Mi\u00e9rt kellene odamenni?<\/p>\n<p><b>AG:<\/b> \u2013 K\u00e9nyszer\u0171en tartani kell egy frontend csapatot.<\/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=\"Vide\u00f3 lej\u00e1tsz\u00e1sa\" 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>Egy kis rekl\u00e1m \ud83d\ude42<\/h3>\n<p>\nK\u00f6sz\u00f6nj\u00fck, hogy vel\u00fcnk maradt\u00e1l. Tetszenek a cikkeink? Szeretn\u00e9l t\u00f6bb \u00e9rdekes anyagot l\u00e1tni? T\u00e1mogass minket, \u00e9s rendel\u00e9s lead\u00e1s\u00e1val vagy ismer\u0151s\u00f6knek aj\u00e1nl\u00e1ssal seg\u00edts nek\u00fcnk. <noindex><a rel=\"nofollow\" href=\"https:\/\/ua-hosting.company\/cloudvps\/nl\">Felh\u0151alap\u00fa VPS fejleszt\u0151knek 4,99 doll\u00e1rt\u00f3l<\/a><\/noindex>, <b>Egyed\u00fcl\u00e1ll\u00f3 alternat\u00edv\u00e1ja az entry-level szervereknek, amelyet \u00d6nnek tal\u00e1ltunk ki:<\/b> <noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/company\/ua-hosting\/blog\/347386\/\">Minden igazs\u00e1g a VPS (KVM) E5-2697 v3 (6 mag) 10GB DDR4 480GB SSD 1Gbps \u00e1ron 19 doll\u00e1rt\u00f3l, vagy hogyan oszd fel helyesen a szervert?<\/a><\/noindex> (el\u00e9rhet\u0151k RAID1 \u00e9s RAID10 opci\u00f3k, ak\u00e1r 24 magig \u00e9s 40GB DDR4-ig).<\/p>\n<p><b>Dell R730xd k\u00e9tszer olcs\u00f3bban a Tier IV Equinix adatk\u00f6zpontban Amszterdamban?<\/b> Csak n\u00e1lunk <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 199 doll\u00e1rt\u00f3l<\/a><\/noindex> Hollandi\u00e1ban! <b>Dell R420 \u2014 2x E5-2430 2.2GHz 6C 128GB DDR3 2x960GB SSD 1Gbps 100TB \u2014 99 doll\u00e1rt\u00f3l!<\/b><\/b> Olvasd el ezt <noindex><a rel=\"nofollow\" href=\"https:\/\/habr.com\/company\/ua-hosting\/blog\/329618\/\">Hogyan \u00e9p\u00edts\u00fcnk v\u00e1llalati szint\u0171 infrastrukt\u00far\u00e1t Dell R730xd E5-2650 v4 szerverekkel, amelyek k\u00f6lts\u00e9ge 9000 eur\u00f3ban van megszabva?<\/a><\/noindex><br \/>\n<br \/>Forr\u00e1s: <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\/hu\/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=\"hu_HU\" \/>\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\/hu\/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 Grachev: Go Frontend | ProHoster","description":"Kyiv Go Meetup 2018 m\u00e1jus: Moder\u00e1tor: \u2013 Mindenki.","canonical_url":"https:\/\/prohoster.info\/hu\/blog\/administrirovanie\/aleksej-grachyov-go-frontend","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"hu_HU","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\/hu\/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\/hu\/wp-json\/wp\/v2\/posts\/71628","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/comments?post=71628"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/posts\/71628\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/media\/71629"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/media?parent=71628"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/categories?post=71628"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/hu\/wp-json\/wp\/v2\/tags?post=71628"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}