{"id":10804,"date":"2022-09-23T12:28:07","date_gmt":"2022-09-23T10:28:07","guid":{"rendered":"https:\/\/vived.io\/?p=10804"},"modified":"2022-09-23T12:29:11","modified_gmt":"2022-09-23T10:29:11","slug":"qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106","status":"publish","type":"post","link":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/","title":{"rendered":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic &#8211; Fronend Weekly vol. 106"},"content":{"rendered":"\n<h2 id=\"1-qwik\" data-num=1>1. Qwik<\/h2>\n\n\n\n<p>Panie i Panowie, najwy\u017cszy czas przekr\u0119ci\u0107 liczniki dni od pojawienia si\u0119 nowego JavaScriptowego frameworku (ten \u017cart nigdy mi si\u0119 nie znudzi). Co prawda firma Builder.io ju\u017c kilka miesi\u0119cy temu zaprezentowa\u0142a \u015bwiatu Qwik, ale dopiero kilka dni temu doczeka\u0142 si\u0119 on wersji beta. Jej pojawienie si\u0119 oznacza, \u017ce wszystkie potrzebne funkcjonalno\u015bci s\u0105 ju\u017c zaimplementowane, API nie ulegnie zmianie do wydania wersji 1.0 i projekt posiada ju\u017c niezb\u0119dn\u0105 dokumentacj\u0119.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"665\" height=\"375\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image10-2.jpg\" alt=\"\" class=\"wp-image-10778\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image10-2.jpg 665w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image10-2-300x169.jpg 300w\" sizes=\"auto, (max-width: 665px) 100vw, 665px\" \/><\/figure><\/div>\n\n\n<p>Je\u015bli do tej pory nie s\u0142yszeli\u015bcie o Builder.io, to najwy\u017csza pora to nadrobi\u0107, bo ta niepozorna firma mo\u017ce mocno w naszym frontendowym \u015bwiatku. I nie mam tutaj na my\u015bli ich flagowego produktu w postaci narz\u0119dzia low-code, a rozwijane troch\u0119 na boku biblioteki i narz\u0119dzia. O uniwersalnym kompilatorze komponent\u00f3w Mitosis, mogli\u015bcie ju\u017c przeczyta\u0107 w jednej z poprzednich edycji naszego przegl\u0105du. Moj\u0105 uwag\u0119 bardziej przykuwaj\u0105 jednak dwa inne projekty: Partytown oraz Qwik. Ten pierwszy pozwala wydzieli\u0107 skrypty stron trzecich do osobnego WebWorkera, co znacz\u0105co usprawnia pocz\u0105tkowe \u0142adowanie strony. Temu drugiemu z okazji premiery wersji beta przyjrzymy si\u0119 dok\u0142adniej w kolejnych akapitach.<\/p>\n\n\n\n<p>Prawdopodobnie nie pisa\u0142bym o Qwik, gdyby nie ludzie rozwijaj\u0105cy projekt. S\u0105 w\u015br\u00f3d nich takie tuzy jak Mi\u0161ko Hevery (tw\u00f3rca anguar.js), Manu Almeida (tw\u00f3rca Gina i Stencila) oraz Adam Bradley (tw\u00f3rca Ionica i Stencila). Mamy tu wi\u0119c swego rodzaju frontendowy All-Stars i zdecydowanie nie jest to kolejny framework tworzony przez nikomu nieznanych ludzi z internetu.<\/p>\n\n\n\n<p>Qwik wywraca do g\u00f3ry nogami paradygmaty wszystkich wsp\u00f3\u0142czesnych narz\u0119dzi do renderowania po stronie serwera, poprzez podwa\u017cenie zasadno\u015bci procesu uwodnienia (jeszcze raz powtarzam &#8211; nie zrezygnuj\u0119 z u\u017cywania ko\u015blawych spolszcze\u0144). Uwodnienie, to proces po stronie klienta, podczas kt\u00f3rego wyrenderowana po stronie serwera aplikacja \u0142aduje kod JavaScript, a nast\u0119pnie powtarza ca\u0142\u0105 logik\u0119 inicjalizacyjn\u0105. O ile klient aplikacji bardzo szybko widzi docelow\u0105 te\u015b\u0107, o tyle sam proces uwodornienia jest zazwyczaj znacz\u0105co d\u0142u\u017cszy.<\/p>\n\n\n\n<p>Alternatywa, kt\u00f3r\u0105 oferuje Qwik, to wznawiane wykonania (ang. Resumable). Paradygmat ten pozwala zapisa\u0107 stan aplikacji po stronie serwera w taki spos\u00f3b, aby po stronie klienta mo\u017cliwe by\u0142o natychmiastowe wznowienie wykonywania kodu. Brzmi skomplikowanie? Na szcz\u0119\u015bcie skomplikowana logika skrz\u0119tnie schowana jest pod przyst\u0119pnym API, kt\u00f3re ca\u0142\u0105 magi\u0119 chowa przed programist\u0105.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"703\" height=\"590\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image5.png\" alt=\"\" class=\"wp-image-10780\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image5.png 703w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image5-300x252.png 300w\" sizes=\"auto, (max-width: 703px) 100vw, 703px\" \/><\/figure><\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"462\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-1024x462.png\" alt=\"\" class=\"wp-image-10782\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-1024x462.png 1024w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-300x135.png 300w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-768x346.png 768w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-1536x693.png 1536w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3.png 2000w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div>\n\n\n<p>No dobra, a co je\u015bli naprawd\u0119 chc\u0119 wiedzie\u0107 jak ta magia dzia\u0142a pod spodem? W kr\u00f3tkiej formie jak\u0105 s\u0105 nasze przegl\u0105dy nie podejm\u0119 si\u0119 wyt\u0142umaczenia jak dzia\u0142aj\u0105 bebechy frameworka i najlepiej b\u0119dzie je\u015bli sami si\u0119gni\u0119cie do dokumentacji. W ogromnym skr\u00f3cie, kod komponent\u00f3w kompilowany jest do osobnych paczek, a sam stan aplikacji zapisywany jest w DOM w \u201cJSONie na sterydach\u201d. Do klienta wysy\u0142any jest wyrenderowany HTML oraz 1KB kody samego Qwika. Ten od razu pobiera kodu wszystkich niezb\u0119dnych komponent\u00f3w, jednak zamiast \u0142\u0105czy\u0107 je od razu z DOM\u2019em czeka na pierwsze interakcje u\u017cytkownika.<\/p>\n\n\n\n<p>Jaka jest moja opinia na temat Qwik? W\u0105tpi\u0119 czy w ostatecznym rozrachunku b\u0119dzie on w stanie konkurowa\u0107 z Reactem czy Angularem. Narz\u0119dzia te operuj\u0105 na prostszych abstrakcjach, przez co tworzenie z ich pomoc\u0105 zaawansowanych aplikacji jest \u0142atwiejsze. Je\u015bli patrzymy natomiast tylko na obszar renderowania po stronie serwera, to ja z ch\u0119ci\u0105 zobaczy\u0142bym por\u00f3wnanie Resumability z Dynamic Islands (Astro, Fresh). Pod sk\u00f3r\u0105 przeczuwam, \u017ce te drugie nie b\u0119d\u0105 wiele wolniejsze i je\u015bli tak b\u0119dzie, to korzystaj\u0105c z prawa brzytwy ockhama, zdecydowanie wygraj\u0105 one ten pojedynek.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"735\" height=\"490\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image1.png\" alt=\"\" class=\"wp-image-10806\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image1.png 735w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image1-300x200.png 300w\" sizes=\"auto, (max-width: 735px) 100vw, 735px\" \/><figcaption>Tak, zdaj\u0119 sobie spraw\u0119, \u017ce tak w\u0142a\u015bnie wygl\u0105dam, a Qwik to zupe\u0142nie inna bajka ni\u017c React i Astro \ud83d\ude09<\/figcaption><\/figure><\/div>\n\n\n<h3 class=\"wp-block-heading\">\u0179r\u00f3d\u0142a:<\/h3>\n\n\n\n<p class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio\"><a href=\"https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY\">https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta\">https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta<\/a><\/p>\n\n\n\n<p><a href=\"https:\/\/qwik.builder.io\/\">https:\/\/qwik.builder.io\/<\/a><\/p>\n\n\n\n<h2 id=\"2-lume\" data-num=2>2. Lume<\/h2>\n\n\n\n<p>Deno ro\u015bnie ostatnio jak na dro\u017cd\u017cach. Zacznijmy od tego, \u017ce w czerwcu w ramach kolejnej rundy finansowania Deno Company zgarn\u0119\u0142o 21 milion\u00f3w dolar\u00f3w.  Niewiele p\u00f3\u017aniej, wydany zosta\u0142 Fresh &#8211; pierwszy framework do renderowania po stronie serwera dedykowany dla Deno. W sierpniu piek\u0142o zamarz\u0142o, bo firma og\u0142osi\u0142a fundamentalne zmiany w rozwijanym przez siebie \u015brodowisku uruchomieniowym. W\u015br\u00f3d nich znalaz\u0142o si\u0119 mi\u0119dzy innymi wsparcie dla npm (!) oraz jeszcze szybszy serwer uruchomieniowy. We wrze\u015bniu Deno wraca na pierwsze strony gazet z dedykowanym generatorem statycznych stron &#8211; Lume.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"501\" height=\"498\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8.png\" alt=\"\" class=\"wp-image-10786\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8.png 501w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8-300x298.png 300w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8-150x150.png 150w\" sizes=\"auto, (max-width: 501px) 100vw, 501px\" \/><\/figure><\/div>\n\n\n<p>Lume wspiera wi\u0119kszo\u015b\u0107 z popularnych format\u00f3w templat\u00f3w, pocz\u0105wszy od Markdown, przez bardziej egzotyczne jak Nunjucks czy Pug, a\u017c po najbardziej standardowy JSX i TSX. Pod wzgl\u0119dem pobierania danych r\u00f3wnie\u017c jest ca\u0142kiem bogato, bo opr\u00f3cz w\u0142asnych loader\u00f3w w TypeScript skorzysta\u0107 mo\u017cemy z wbudowanych obs\u0142uguj\u0105cych zar\u00f3wno YAML jak i JSON. Wynikiem dzia\u0142ania Lume s\u0105 ca\u0142kowicie statyczne pliki HTML, a do klienta nie jest wysy\u0142any ani jeden kilobajt JavaScript.<\/p>\n\n\n\n<p>Lume mo\u017ce by\u0107 hostowany przy u\u017cyciu dowolnego dostawcy us\u0142ug chmurowych i Deno Deploy nie jest tutaj nadmiernie wpychany u\u017cytkownikom. W dokumentacji znajdziemy dok\u0142adne instrukcje wdro\u017cenia dla 9 chmur, a matczyna chmura umieszczona jest dopiero na 4 miejscu.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"655\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image11.png\" alt=\"\" class=\"wp-image-10788\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image11.png 500w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image11-229x300.png 229w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><\/figure><\/div>\n\n\n<h3 class=\"wp-block-heading\">\u0179r\u00f3d\u0142o:<\/h3>\n\n\n\n<p><a href=\"https:\/\/lume.land\/\">https:\/\/lume.land\/<\/a><\/p>\n\n\n\n<h2 id=\"bonus-list-do-reacta\" data-num=3>Bonus: List do Reacta<\/h2>\n\n\n\n<p>Jako, \u017ce dzisiejsza edycja wysz\u0142a odrobin\u0119 kr\u00f3tsza ni\u017c zazwyczaj, to na koniec postanowi\u0142em podzieli\u0107 si\u0119 z Wami ciekawym  artyku\u0142em, kt\u00f3ry podbi\u0142 ostatnio Reddita i  Hacker Newsy. <\/p>\n\n\n\n<p>Czujecie pod sk\u00f3r\u0105, \u017ce z Reactem co\u015b jest nie tak? A mo\u017ce wr\u0119cz przeciwnie? Niezale\u017cnie od odpowiedzi, w li\u015bcie autorstwa Fran\u00e7oisa Zaninotto, znajdziecie kilka zr\u0119cznie wypunktowanych wad Reacta. Podobnych artyku\u0142\u00f3w widzia\u0142em ju\u017c sporo, ale w tym przypadku autor jasno przedstawia swoj\u0105 krytyk\u0119 i na jej poparcie ma solidne argumenty.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"661\" height=\"378\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image6.png\" alt=\"\" class=\"wp-image-10790\" srcset=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image6.png 661w, https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image6-300x172.png 300w\" sizes=\"auto, (max-width: 661px) 100vw, 661px\" \/><\/figure><\/div>\n\n\n<p>PS: Svelte for the win!<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0179r\u00f3d\u0142a:<\/h3>\n\n\n\n<p><a href=\"https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html\">https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Dni od pojawienia si\u0119 kolejnego frontendowego frameworka &#8211; 0. Bohaterem dzisiejszego wpisu jest Qwik, czyli nowy framework od tw\u00f3rc\u00f3w angular.js, Ionica i Stencila, kt\u00f3ry wa\u017cy zaledwie 1kb i rewolucjonizuje podej\u015bcie do renderowania o stronie serwera.<\/p>\n","protected":false},"author":12,"featured_media":10794,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[273],"tags":[],"class_list":["post-10804","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-frontend-pl"],"acf":{"estimated_reading_time":"7","feature_image_blog":{"ID":10796,"id":10796,"title":"image4","filename":"image4.png","filesize":499106,"url":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","link":"https:\/\/vived.io\/pl\/qwik-a-new-framework-from-the-authors-of-angular-js-and-ionic-frontend-weekly-vol-106\/image4\/","alt":"","author":"15","description":"","caption":"","name":"image4","status":"inherit","uploaded_to":10777,"date":"2022-09-23 09:58:15","modified":"2022-09-23 09:58:15","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/vived.io\/wp-includes\/images\/media\/default.png","width":1125,"height":750,"sizes":{"thumbnail":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4-150x150.png","thumbnail-width":150,"thumbnail-height":150,"medium":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4-300x200.png","medium-width":300,"medium-height":200,"medium_large":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4-768x512.png","medium_large-width":768,"medium_large-height":512,"large":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4-1024x683.png","large-width":1024,"large-height":683,"1536x1536":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","1536x1536-width":1125,"1536x1536-height":750,"2048x2048":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","2048x2048-width":1125,"2048x2048-height":750,"gform-image-choice-sm":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","gform-image-choice-sm-width":300,"gform-image-choice-sm-height":200,"gform-image-choice-md":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","gform-image-choice-md-width":400,"gform-image-choice-md-height":267,"gform-image-choice-lg":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image4.png","gform-image-choice-lg-width":600,"gform-image-choice-lg-height":400}},"weekly_summary":true,"push_notification_image":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","feature_image_visible":false},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived\" \/>\n<meta property=\"og:description\" content=\"Dni od pojawienia si\u0119 kolejnego frontendowego frameworka - 0. Bohaterem dzisiejszego wpisu jest Qwik, czyli nowy framework od tw\u00f3rc\u00f3w angular.js, Ionica i Stencila, kt\u00f3ry wa\u017cy zaledwie 1kb i rewolucjonizuje podej\u015bcie do renderowania o stronie serwera.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\" \/>\n<meta property=\"og:site_name\" content=\"Vived\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-23T10:28:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-23T10:29:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Tomasz Borowicz\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\"},\"author\":{\"name\":\"Tomasz Borowicz\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\"},\"headline\":\"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic &#8211; Fronend Weekly vol. 106\",\"datePublished\":\"2022-09-23T10:28:07+00:00\",\"dateModified\":\"2022-09-23T10:29:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\"},\"wordCount\":989,\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png\",\"articleSection\":[\"Frontend\"],\"inLanguage\":\"pl-PL\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\",\"url\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\",\"name\":\"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png\",\"datePublished\":\"2022-09-23T10:28:07+00:00\",\"dateModified\":\"2022-09-23T10:29:11+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png\",\"width\":1200,\"height\":628},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/vived.io\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic &#8211; Fronend Weekly vol. 106\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/vived.io\/pl\/#website\",\"url\":\"https:\/\/vived.io\/pl\/\",\"name\":\"Vived\",\"description\":\"platform empowering IT people and technology companies to synergic growth\",\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/vived.io\/pl\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pl-PL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/vived.io\/pl\/#organization\",\"name\":\"Vived\",\"url\":\"https:\/\/vived.io\/pl\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png\",\"width\":136,\"height\":45,\"caption\":\"Vived\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\",\"name\":\"Tomasz Borowicz\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g\",\"caption\":\"Tomasz Borowicz\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/","og_locale":"pl_PL","og_type":"article","og_title":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived","og_description":"Dni od pojawienia si\u0119 kolejnego frontendowego frameworka - 0. Bohaterem dzisiejszego wpisu jest Qwik, czyli nowy framework od tw\u00f3rc\u00f3w angular.js, Ionica i Stencila, kt\u00f3ry wa\u017cy zaledwie 1kb i rewolucjonizuje podej\u015bcie do renderowania o stronie serwera.","og_url":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/","og_site_name":"Vived","article_published_time":"2022-09-23T10:28:07+00:00","article_modified_time":"2022-09-23T10:29:11+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","type":"image\/png"}],"author":"Tomasz Borowicz","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#article","isPartOf":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/"},"author":{"name":"Tomasz Borowicz","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb"},"headline":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic &#8211; Fronend Weekly vol. 106","datePublished":"2022-09-23T10:28:07+00:00","dateModified":"2022-09-23T10:29:11+00:00","mainEntityOfPage":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/"},"wordCount":989,"publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"image":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","articleSection":["Frontend"],"inLanguage":"pl-PL"},{"@type":"WebPage","@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/","url":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/","name":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic - Fronend Weekly vol. 106 - Vived","isPartOf":{"@id":"https:\/\/vived.io\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage"},"image":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","datePublished":"2022-09-23T10:28:07+00:00","dateModified":"2022-09-23T10:29:11+00:00","breadcrumb":{"@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#primaryimage","url":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/frontend106-pl.png","width":1200,"height":628},{"@type":"BreadcrumbList","@id":"https:\/\/vived.io\/pl\/qwik-nowy-framework-od-tworcow-angular-js-i-ionic-fronend-weekly-vol-106\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/vived.io\/pl\/"},{"@type":"ListItem","position":2,"name":"Qwik, nowy framework od tw\u00f3rc\u00f3w angular.js i Ionic &#8211; Fronend Weekly vol. 106"}]},{"@type":"WebSite","@id":"https:\/\/vived.io\/pl\/#website","url":"https:\/\/vived.io\/pl\/","name":"Vived","description":"platform empowering IT people and technology companies to synergic growth","publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/vived.io\/pl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pl-PL"},{"@type":"Organization","@id":"https:\/\/vived.io\/pl\/#organization","name":"Vived","url":"https:\/\/vived.io\/pl\/","logo":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/","url":"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2020\/03\/logo_vived_color.png","width":136,"height":45,"caption":"Vived"},"image":{"@id":"https:\/\/vived.io\/pl\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb","name":"Tomasz Borowicz","image":{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/804536d2672538508d43f60ad2108e5aaea76c192653eaf95d4c3934b7d1dbb6?s=96&d=mm&r=g","caption":"Tomasz Borowicz"}}]}},"blocks_vived":[{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2>1. Qwik<\/h2>\n","innerContent":["\n<h2>1. Qwik<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Panie i Panowie, najwy\u017cszy czas przekr\u0119ci\u0107 liczniki dni od pojawienia si\u0119 nowego JavaScriptowego frameworku (ten \u017cart nigdy mi si\u0119 nie znudzi). Co prawda firma Builder.io ju\u017c kilka miesi\u0119cy temu zaprezentowa\u0142a \u015bwiatu Qwik, ale dopiero kilka dni temu doczeka\u0142 si\u0119 on wersji beta. Jej pojawienie si\u0119 oznacza, \u017ce wszystkie potrzebne funkcjonalno\u015bci s\u0105 ju\u017c zaimplementowane, API nie ulegnie zmianie do wydania wersji 1.0 i projekt posiada ju\u017c niezb\u0119dn\u0105 dokumentacj\u0119.<\/p>\n","innerContent":["\n<p>Panie i Panowie, najwy\u017cszy czas przekr\u0119ci\u0107 liczniki dni od pojawienia si\u0119 nowego JavaScriptowego frameworku (ten \u017cart nigdy mi si\u0119 nie znudzi). Co prawda firma Builder.io ju\u017c kilka miesi\u0119cy temu zaprezentowa\u0142a \u015bwiatu Qwik, ale dopiero kilka dni temu doczeka\u0142 si\u0119 on wersji beta. Jej pojawienie si\u0119 oznacza, \u017ce wszystkie potrzebne funkcjonalno\u015bci s\u0105 ju\u017c zaimplementowane, API nie ulegnie zmianie do wydania wersji 1.0 i projekt posiada ju\u017c niezb\u0119dn\u0105 dokumentacj\u0119.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10778,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image10-2.jpg\" alt=\"\" class=\"wp-image-10778\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image10-2.jpg\" alt=\"\" class=\"wp-image-10778\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Je\u015bli do tej pory nie s\u0142yszeli\u015bcie o Builder.io, to najwy\u017csza pora to nadrobi\u0107, bo ta niepozorna firma mo\u017ce mocno w naszym frontendowym \u015bwiatku. I nie mam tutaj na my\u015bli ich flagowego produktu w postaci narz\u0119dzia low-code, a rozwijane troch\u0119 na boku biblioteki i narz\u0119dzia. O uniwersalnym kompilatorze komponent\u00f3w Mitosis, mogli\u015bcie ju\u017c przeczyta\u0107 w jednej z poprzednich edycji naszego przegl\u0105du. Moj\u0105 uwag\u0119 bardziej przykuwaj\u0105 jednak dwa inne projekty: Partytown oraz Qwik. Ten pierwszy pozwala wydzieli\u0107 skrypty stron trzecich do osobnego WebWorkera, co znacz\u0105co usprawnia pocz\u0105tkowe \u0142adowanie strony. Temu drugiemu z okazji premiery wersji beta przyjrzymy si\u0119 dok\u0142adniej w kolejnych akapitach.<\/p>\n","innerContent":["\n<p>Je\u015bli do tej pory nie s\u0142yszeli\u015bcie o Builder.io, to najwy\u017csza pora to nadrobi\u0107, bo ta niepozorna firma mo\u017ce mocno w naszym frontendowym \u015bwiatku. I nie mam tutaj na my\u015bli ich flagowego produktu w postaci narz\u0119dzia low-code, a rozwijane troch\u0119 na boku biblioteki i narz\u0119dzia. O uniwersalnym kompilatorze komponent\u00f3w Mitosis, mogli\u015bcie ju\u017c przeczyta\u0107 w jednej z poprzednich edycji naszego przegl\u0105du. Moj\u0105 uwag\u0119 bardziej przykuwaj\u0105 jednak dwa inne projekty: Partytown oraz Qwik. Ten pierwszy pozwala wydzieli\u0107 skrypty stron trzecich do osobnego WebWorkera, co znacz\u0105co usprawnia pocz\u0105tkowe \u0142adowanie strony. Temu drugiemu z okazji premiery wersji beta przyjrzymy si\u0119 dok\u0142adniej w kolejnych akapitach.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Prawdopodobnie nie pisa\u0142bym o Qwik, gdyby nie ludzie rozwijaj\u0105cy projekt. S\u0105 w\u015br\u00f3d nich takie tuzy jak Mi\u0161ko Hevery (tw\u00f3rca anguar.js), Manu Almeida (tw\u00f3rca Gina i Stencila) oraz Adam Bradley (tw\u00f3rca Ionica i Stencila). Mamy tu wi\u0119c swego rodzaju frontendowy All-Stars i zdecydowanie nie jest to kolejny framework tworzony przez nikomu nieznanych ludzi z internetu.<\/p>\n","innerContent":["\n<p>Prawdopodobnie nie pisa\u0142bym o Qwik, gdyby nie ludzie rozwijaj\u0105cy projekt. S\u0105 w\u015br\u00f3d nich takie tuzy jak Mi\u0161ko Hevery (tw\u00f3rca anguar.js), Manu Almeida (tw\u00f3rca Gina i Stencila) oraz Adam Bradley (tw\u00f3rca Ionica i Stencila). Mamy tu wi\u0119c swego rodzaju frontendowy All-Stars i zdecydowanie nie jest to kolejny framework tworzony przez nikomu nieznanych ludzi z internetu.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Qwik wywraca do g\u00f3ry nogami paradygmaty wszystkich wsp\u00f3\u0142czesnych narz\u0119dzi do renderowania po stronie serwera, poprzez podwa\u017cenie zasadno\u015bci procesu uwodnienia (jeszcze raz powtarzam - nie zrezygnuj\u0119 z u\u017cywania ko\u015blawych spolszcze\u0144). Uwodnienie, to proces po stronie klienta, podczas kt\u00f3rego wyrenderowana po stronie serwera aplikacja \u0142aduje kod JavaScript, a nast\u0119pnie powtarza ca\u0142\u0105 logik\u0119 inicjalizacyjn\u0105. O ile klient aplikacji bardzo szybko widzi docelow\u0105 te\u015b\u0107, o tyle sam proces uwodornienia jest zazwyczaj znacz\u0105co d\u0142u\u017cszy.<\/p>\n","innerContent":["\n<p>Qwik wywraca do g\u00f3ry nogami paradygmaty wszystkich wsp\u00f3\u0142czesnych narz\u0119dzi do renderowania po stronie serwera, poprzez podwa\u017cenie zasadno\u015bci procesu uwodnienia (jeszcze raz powtarzam - nie zrezygnuj\u0119 z u\u017cywania ko\u015blawych spolszcze\u0144). Uwodnienie, to proces po stronie klienta, podczas kt\u00f3rego wyrenderowana po stronie serwera aplikacja \u0142aduje kod JavaScript, a nast\u0119pnie powtarza ca\u0142\u0105 logik\u0119 inicjalizacyjn\u0105. O ile klient aplikacji bardzo szybko widzi docelow\u0105 te\u015b\u0107, o tyle sam proces uwodornienia jest zazwyczaj znacz\u0105co d\u0142u\u017cszy.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Alternatywa, kt\u00f3r\u0105 oferuje Qwik, to wznawiane wykonania (ang. Resumable). Paradygmat ten pozwala zapisa\u0107 stan aplikacji po stronie serwera w taki spos\u00f3b, aby po stronie klienta mo\u017cliwe by\u0142o natychmiastowe wznowienie wykonywania kodu. Brzmi skomplikowanie? Na szcz\u0119\u015bcie skomplikowana logika skrz\u0119tnie schowana jest pod przyst\u0119pnym API, kt\u00f3re ca\u0142\u0105 magi\u0119 chowa przed programist\u0105.<\/p>\n","innerContent":["\n<p>Alternatywa, kt\u00f3r\u0105 oferuje Qwik, to wznawiane wykonania (ang. Resumable). Paradygmat ten pozwala zapisa\u0107 stan aplikacji po stronie serwera w taki spos\u00f3b, aby po stronie klienta mo\u017cliwe by\u0142o natychmiastowe wznowienie wykonywania kodu. Brzmi skomplikowanie? Na szcz\u0119\u015bcie skomplikowana logika skrz\u0119tnie schowana jest pod przyst\u0119pnym API, kt\u00f3re ca\u0142\u0105 magi\u0119 chowa przed programist\u0105.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10780,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image5.png\" alt=\"\" class=\"wp-image-10780\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image5.png\" alt=\"\" class=\"wp-image-10780\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10782,"sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-large\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-1024x462.png\" alt=\"\" class=\"wp-image-10782\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-large\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image3-1024x462.png\" alt=\"\" class=\"wp-image-10782\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>No dobra, a co je\u015bli naprawd\u0119 chc\u0119 wiedzie\u0107 jak ta magia dzia\u0142a pod spodem? W kr\u00f3tkiej formie jak\u0105 s\u0105 nasze przegl\u0105dy nie podejm\u0119 si\u0119 wyt\u0142umaczenia jak dzia\u0142aj\u0105 bebechy frameworka i najlepiej b\u0119dzie je\u015bli sami si\u0119gni\u0119cie do dokumentacji. W ogromnym skr\u00f3cie, kod komponent\u00f3w kompilowany jest do osobnych paczek, a sam stan aplikacji zapisywany jest w DOM w \u201cJSONie na sterydach\u201d. Do klienta wysy\u0142any jest wyrenderowany HTML oraz 1KB kody samego Qwika. Ten od razu pobiera kodu wszystkich niezb\u0119dnych komponent\u00f3w, jednak zamiast \u0142\u0105czy\u0107 je od razu z DOM\u2019em czeka na pierwsze interakcje u\u017cytkownika.<\/p>\n","innerContent":["\n<p>No dobra, a co je\u015bli naprawd\u0119 chc\u0119 wiedzie\u0107 jak ta magia dzia\u0142a pod spodem? W kr\u00f3tkiej formie jak\u0105 s\u0105 nasze przegl\u0105dy nie podejm\u0119 si\u0119 wyt\u0142umaczenia jak dzia\u0142aj\u0105 bebechy frameworka i najlepiej b\u0119dzie je\u015bli sami si\u0119gni\u0119cie do dokumentacji. W ogromnym skr\u00f3cie, kod komponent\u00f3w kompilowany jest do osobnych paczek, a sam stan aplikacji zapisywany jest w DOM w \u201cJSONie na sterydach\u201d. Do klienta wysy\u0142any jest wyrenderowany HTML oraz 1KB kody samego Qwika. Ten od razu pobiera kodu wszystkich niezb\u0119dnych komponent\u00f3w, jednak zamiast \u0142\u0105czy\u0107 je od razu z DOM\u2019em czeka na pierwsze interakcje u\u017cytkownika.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Jaka jest moja opinia na temat Qwik? W\u0105tpi\u0119 czy w ostatecznym rozrachunku b\u0119dzie on w stanie konkurowa\u0107 z Reactem czy Angularem. Narz\u0119dzia te operuj\u0105 na prostszych abstrakcjach, przez co tworzenie z ich pomoc\u0105 zaawansowanych aplikacji jest \u0142atwiejsze. Je\u015bli patrzymy natomiast tylko na obszar renderowania po stronie serwera, to ja z ch\u0119ci\u0105 zobaczy\u0142bym por\u00f3wnanie Resumability z Dynamic Islands (Astro, Fresh). Pod sk\u00f3r\u0105 przeczuwam, \u017ce te drugie nie b\u0119d\u0105 wiele wolniejsze i je\u015bli tak b\u0119dzie, to korzystaj\u0105c z prawa brzytwy ockhama, zdecydowanie wygraj\u0105 one ten pojedynek.<\/p>\n","innerContent":["\n<p>Jaka jest moja opinia na temat Qwik? W\u0105tpi\u0119 czy w ostatecznym rozrachunku b\u0119dzie on w stanie konkurowa\u0107 z Reactem czy Angularem. Narz\u0119dzia te operuj\u0105 na prostszych abstrakcjach, przez co tworzenie z ich pomoc\u0105 zaawansowanych aplikacji jest \u0142atwiejsze. Je\u015bli patrzymy natomiast tylko na obszar renderowania po stronie serwera, to ja z ch\u0119ci\u0105 zobaczy\u0142bym por\u00f3wnanie Resumability z Dynamic Islands (Astro, Fresh). Pod sk\u00f3r\u0105 przeczuwam, \u017ce te drugie nie b\u0119d\u0105 wiele wolniejsze i je\u015bli tak b\u0119dzie, to korzystaj\u0105c z prawa brzytwy ockhama, zdecydowanie wygraj\u0105 one ten pojedynek.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10806,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image1.png\" alt=\"\" class=\"wp-image-10806\"\/><figcaption>Tak, zdaj\u0119 sobie spraw\u0119, \u017ce tak w\u0142a\u015bnie wygl\u0105dam, a Qwik to zupe\u0142nie inna bajka ni\u017c React i Astro ;)<\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image1.png\" alt=\"\" class=\"wp-image-10806\"\/><figcaption>Tak, zdaj\u0119 sobie spraw\u0119, \u017ce tak w\u0142a\u015bnie wygl\u0105dam, a Qwik to zupe\u0142nie inna bajka ni\u017c React i Astro ;)<\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3>\u0179r\u00f3d\u0142a:<\/h3>\n","innerContent":["\n<h3>\u0179r\u00f3d\u0142a:<\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":{"className":"wp-embed-aspect-16-9 wp-has-aspect-ratio"},"innerBlocks":[],"innerHTML":"\n<p class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio\"><a href=\"https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY\">https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY<\/a><\/p>\n","innerContent":["\n<p class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio\"><a href=\"https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY\">https:\/\/www.youtube.com\/watch?v=x2eF3YLiNhY<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><a href=\"https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta\">https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta\">https:\/\/www.builder.io\/blog\/qwik-and-qwik-city-have-reached-beta<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><a href=\"https:\/\/qwik.builder.io\/\">https:\/\/qwik.builder.io\/<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/qwik.builder.io\/\">https:\/\/qwik.builder.io\/<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2>2. Lume<\/h2>\n","innerContent":["\n<h2>2. Lume<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Deno ro\u015bnie ostatnio jak na dro\u017cd\u017cach. Zacznijmy od tego, \u017ce w czerwcu w ramach kolejnej rundy finansowania Deno Company zgarn\u0119\u0142o 21 milion\u00f3w dolar\u00f3w.  Niewiele p\u00f3\u017aniej, wydany zosta\u0142 Fresh - pierwszy framework do renderowania po stronie serwera dedykowany dla Deno. W sierpniu piek\u0142o zamarz\u0142o, bo firma og\u0142osi\u0142a fundamentalne zmiany w rozwijanym przez siebie \u015brodowisku uruchomieniowym. W\u015br\u00f3d nich znalaz\u0142o si\u0119 mi\u0119dzy innymi wsparcie dla npm (!) oraz jeszcze szybszy serwer uruchomieniowy. We wrze\u015bniu Deno wraca na pierwsze strony gazet z dedykowanym generatorem statycznych stron - Lume.<\/p>\n","innerContent":["\n<p>Deno ro\u015bnie ostatnio jak na dro\u017cd\u017cach. Zacznijmy od tego, \u017ce w czerwcu w ramach kolejnej rundy finansowania Deno Company zgarn\u0119\u0142o 21 milion\u00f3w dolar\u00f3w.  Niewiele p\u00f3\u017aniej, wydany zosta\u0142 Fresh - pierwszy framework do renderowania po stronie serwera dedykowany dla Deno. W sierpniu piek\u0142o zamarz\u0142o, bo firma og\u0142osi\u0142a fundamentalne zmiany w rozwijanym przez siebie \u015brodowisku uruchomieniowym. W\u015br\u00f3d nich znalaz\u0142o si\u0119 mi\u0119dzy innymi wsparcie dla npm (!) oraz jeszcze szybszy serwer uruchomieniowy. We wrze\u015bniu Deno wraca na pierwsze strony gazet z dedykowanym generatorem statycznych stron - Lume.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10786,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8.png\" alt=\"\" class=\"wp-image-10786\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image8.png\" alt=\"\" class=\"wp-image-10786\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Lume wspiera wi\u0119kszo\u015b\u0107 z popularnych format\u00f3w templat\u00f3w, pocz\u0105wszy od Markdown, przez bardziej egzotyczne jak Nunjucks czy Pug, a\u017c po najbardziej standardowy JSX i TSX. Pod wzgl\u0119dem pobierania danych r\u00f3wnie\u017c jest ca\u0142kiem bogato, bo opr\u00f3cz w\u0142asnych loader\u00f3w w TypeScript skorzysta\u0107 mo\u017cemy z wbudowanych obs\u0142uguj\u0105cych zar\u00f3wno YAML jak i JSON. Wynikiem dzia\u0142ania Lume s\u0105 ca\u0142kowicie statyczne pliki HTML, a do klienta nie jest wysy\u0142any ani jeden kilobajt JavaScript.<\/p>\n","innerContent":["\n<p>Lume wspiera wi\u0119kszo\u015b\u0107 z popularnych format\u00f3w templat\u00f3w, pocz\u0105wszy od Markdown, przez bardziej egzotyczne jak Nunjucks czy Pug, a\u017c po najbardziej standardowy JSX i TSX. Pod wzgl\u0119dem pobierania danych r\u00f3wnie\u017c jest ca\u0142kiem bogato, bo opr\u00f3cz w\u0142asnych loader\u00f3w w TypeScript skorzysta\u0107 mo\u017cemy z wbudowanych obs\u0142uguj\u0105cych zar\u00f3wno YAML jak i JSON. Wynikiem dzia\u0142ania Lume s\u0105 ca\u0142kowicie statyczne pliki HTML, a do klienta nie jest wysy\u0142any ani jeden kilobajt JavaScript.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Lume mo\u017ce by\u0107 hostowany przy u\u017cyciu dowolnego dostawcy us\u0142ug chmurowych i Deno Deploy nie jest tutaj nadmiernie wpychany u\u017cytkownikom. W dokumentacji znajdziemy dok\u0142adne instrukcje wdro\u017cenia dla 9 chmur, a matczyna chmura umieszczona jest dopiero na 4 miejscu.<\/p>\n","innerContent":["\n<p>Lume mo\u017ce by\u0107 hostowany przy u\u017cyciu dowolnego dostawcy us\u0142ug chmurowych i Deno Deploy nie jest tutaj nadmiernie wpychany u\u017cytkownikom. W dokumentacji znajdziemy dok\u0142adne instrukcje wdro\u017cenia dla 9 chmur, a matczyna chmura umieszczona jest dopiero na 4 miejscu.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10788,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image11.png\" alt=\"\" class=\"wp-image-10788\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image11.png\" alt=\"\" class=\"wp-image-10788\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3>\u0179r\u00f3d\u0142o:<\/h3>\n","innerContent":["\n<h3>\u0179r\u00f3d\u0142o:<\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><a href=\"https:\/\/lume.land\/\">https:\/\/lume.land\/<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/lume.land\/\">https:\/\/lume.land\/<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":[],"innerBlocks":[],"innerHTML":"\n<h2>Bonus: List do Reacta<\/h2>\n","innerContent":["\n<h2>Bonus: List do Reacta<\/h2>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Jako, \u017ce dzisiejsza edycja wysz\u0142a odrobin\u0119 kr\u00f3tsza ni\u017c zazwyczaj, to na koniec postanowi\u0142em podzieli\u0107 si\u0119 z Wami ciekawym  artyku\u0142em, kt\u00f3ry podbi\u0142 ostatnio Reddita i  Hacker Newsy. <\/p>\n","innerContent":["\n<p>Jako, \u017ce dzisiejsza edycja wysz\u0142a odrobin\u0119 kr\u00f3tsza ni\u017c zazwyczaj, to na koniec postanowi\u0142em podzieli\u0107 si\u0119 z Wami ciekawym  artyku\u0142em, kt\u00f3ry podbi\u0142 ostatnio Reddita i  Hacker Newsy. <\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Czujecie pod sk\u00f3r\u0105, \u017ce z Reactem co\u015b jest nie tak? A mo\u017ce wr\u0119cz przeciwnie? Niezale\u017cnie od odpowiedzi, w li\u015bcie autorstwa Fran\u00e7oisa Zaninotto, znajdziecie kilka zr\u0119cznie wypunktowanych wad Reacta. Podobnych artyku\u0142\u00f3w widzia\u0142em ju\u017c sporo, ale w tym przypadku autor jasno przedstawia swoj\u0105 krytyk\u0119 i na jej poparcie ma solidne argumenty.<\/p>\n","innerContent":["\n<p>Czujecie pod sk\u00f3r\u0105, \u017ce z Reactem co\u015b jest nie tak? A mo\u017ce wr\u0119cz przeciwnie? Niezale\u017cnie od odpowiedzi, w li\u015bcie autorstwa Fran\u00e7oisa Zaninotto, znajdziecie kilka zr\u0119cznie wypunktowanych wad Reacta. Podobnych artyku\u0142\u00f3w widzia\u0142em ju\u017c sporo, ale w tym przypadku autor jasno przedstawia swoj\u0105 krytyk\u0119 i na jej poparcie ma solidne argumenty.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":10790,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image6.png\" alt=\"\" class=\"wp-image-10790\"\/><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2022\/09\/image6.png\" alt=\"\" class=\"wp-image-10790\"\/><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>PS: Svelte for the win!<\/p>\n","innerContent":["\n<p>PS: Svelte for the win!<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":3},"innerBlocks":[],"innerHTML":"\n<h3>\u0179r\u00f3d\u0142a:<\/h3>\n","innerContent":["\n<h3>\u0179r\u00f3d\u0142a:<\/h3>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p><a href=\"https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html\">https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html\">https:\/\/marmelab.com\/blog\/2022\/09\/20\/react-i-love-you.html<\/a><\/p>\n"]}],"_links":{"self":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10804","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/comments?post=10804"}],"version-history":[{"count":6,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10804\/revisions"}],"predecessor-version":[{"id":10816,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10804\/revisions\/10816"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media\/10794"}],"wp:attachment":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media?parent=10804"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/categories?post=10804"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/tags?post=10804"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}