{"id":10117,"date":"2021-07-01T17:27:04","date_gmt":"2021-07-01T15:27:04","guid":{"rendered":"https:\/\/vived.io\/frontend-thursday-vol-44\/"},"modified":"2022-09-19T13:16:41","modified_gmt":"2022-09-19T11:16:41","slug":"frontend-thursday-vol-44","status":"publish","type":"post","link":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/","title":{"rendered":"Frontend Thursday vol. 44"},"content":{"rendered":"<h1 id=\"1-microsoft-teams-20\">1. Microsoft Teams 2.0<\/h1>\n<p>Microsoft Teams to aplikacja, kt\u00f3ra dzi\u0119ki pandemii zdoby\u0142a globaln\u0105 rozpoznawalno\u015b\u0107. Jest to te\u017c jedna z sztandarowych aplikacji wymienianych jako przyk\u0142ad wdro\u017cenia Electrona na produkcji. No c\u00f3\u017c, nied\u0142ugo stan rzeczy si\u0119 zmieni, bo w minionym tygodniu CVP Microsoftu (je\u015bli te\u017c zastanawiacie si\u0119 jak rozwin\u0105\u0107 ten korporacyjny skr\u00f3t, to chodzi tu o Corporate Vice President) pochwali\u0142 si\u0119 na Twitterze, \u017ce wkr\u00f3tce flagowy komunikator firmy z Redmont dostanie aktualizacj\u0119 zast\u0119puj\u0105c\u0105 Electrona Edge Webview2. Z czego wynika takie posuni\u0119cie? Electron znany jest z zasobo\u017cerno\u015bci, szczeg\u00f3lnie je\u015bli chodzi o RAM. Microsoft posiada nawet <a href=\"https:\/\/docs.microsoft.com\/en-us\/microsoftteams\/teams-memory-usage-perf\">stron\u0119 w dokumentacji<\/a> wyja\u015bniaj\u0105c\u0105 z czego wynika takie zu\u017cycie pami\u0119ci (TLDR: Chromium w celu optymalizacji rezerwuje sobie tak du\u017co pami\u0119ci jak to tylko mo\u017cliwe). Nowe rozwi\u0105zanie to autorski tw\u00f3r microsoftu, kt\u00f3ry opr\u00f3cz lepszego zarz\u0105dzania zasobami oferuje te\u017c Evergreen Distribution, czyli mo\u017cliwo\u015b\u0107 utrzymania u\u017cytkownik\u00f3w z najnowsz\u0105 wersj\u0105 przegl\u0105darki. Wszystko jest o tyle ciekawe, \u017ce Edge r\u00f3wnie\u017c pod spodem bazuje na Chromium.<\/p>\n<p>Nowa wersja teams\u00f3w przynosi te\u017c jedn\u0105 nowo\u015b\u0107, kt\u00f3ra szczeg\u00f3lnie boli moje Angularowe serducho: ca\u0142o\u015b\u0107 aplikacji zosta\u0142a przepisana z Angulara na Reacta. Mam nadziej\u0119, \u017c\u0119 in\u017cynierowie z Microsoftu podziel\u0105 si\u0119 kiedy\u015b artyku\u0142em, w kt\u00f3rym wyja\u015bni\u0105 powody podj\u0119cia takiej decyzji.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img decoding=\"async\" class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\" alt=\"\" \/><figcaption>Standardowy mem o Chrom\u0119. Naprawd\u0119 obiecuj\u0119, \u017ce to ju\u017c ostatni raz\u00a0<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/\">https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/<\/a><br \/>\n<a href=\"https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/\">https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/<\/a><\/p>\n<h1 id=\"2-google-op%C3%B3%C5%BAnia-floc-do-2023\">2. Google op\u00f3\u017ania FLoC do 2023<\/h1>\n<p>FLoC to temat, o kt\u00f3rym szerzej rozpisywa\u0142em si\u0119 <a href=\"https:\/\/blog.vived.io\/frontend-thursday-vol-33\/\">w edycji 33<\/a> naszego przegl\u0105du, ale gwoli \u015bcis\u0142o\u015bci postaram si\u0119 w dw\u00f3ch zdaniach przypomnie\u0107 o co chodzi. Ot\u00f3\u017c Google opracowa\u0142 algorytm klastruj\u0105cych u\u017cytkownik\u00f3w lokalnie na ich maszynach. W teorii wszystko brzmi \u015bwietnie, ale po przygl\u0105dni\u0119ciu si\u0119 bli\u017cej, rozwi\u0105zanie to raczej pogarsza ni\u017c poprawia prywatno\u015b\u0107 u\u017cytkownik\u00f3w. W tym kontek\u015bcie na pewno cieszy fakt, \u017ce Google postanowi\u0142 p\u00f3ki co wstrzyma\u0107 si\u0119 z globalnym wdro\u017ceniem algorytmu w Chrome do 2023 roku. Dodatkowy czas Google zamierza wykorzysta\u0107 na rozpocz\u0119ciu publicznej dyskusji dotycz\u0105cych prywatno\u015bci w kontek\u015bcie personalizacji reklam jak i negocjacjach z innymi du\u017cymi graczami w \u015bwiecie przegl\u0105darek i e-commerce.<\/p>\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img decoding=\"async\" class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091abe093.gif\" alt=\"\" \/><figcaption>Je\u015bli ju\u017c nawet sam Google po cichu przyznaje, \u017ce FLoC ma swoje wady, to znaczy, \u017ce nad algorytmem naprawd\u0119 zacz\u0119\u0142y rozci\u0105ga\u0107 si\u0119 ciemne chmury. CIekawe tylko jak Google wybrnie teraz z tego problemu.<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-1\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/\">https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/<\/a><\/p>\n<h1 id=\"3-solidjs\">3. SolidJS<\/h1>\n<p>Jak g\u0142osi stare programistyczne porzekad\u0142o: tydzie\u0144 bez nowego javascriptowego frameworku to tydzie\u0144 stracony. Po prawie roku tworzenia naszych frontendowych przegl\u0105d\u00f3w jestem pewien, \u017ce mocno mija si\u0119 ono z prawd\u0105, ale w tym tygodniu rzeczywi\u015bcie na rynku pojawi\u0142 si\u0119 nowy gracz, kt\u00f3ry wzbudzi\u0142 troch\u0119 zamieszania. Raczej nie przebije si\u0119 on do czo\u0142owej tr\u00f3jki frontendowych framework\u00f3w. Ba, my\u015bl\u0119, \u017ce pozycja czwartego Svelte r\u00f3wnie\u017c nie jest na razie zagro\u017cona. Dlaczego wi\u0119c podrzucamy Wam to rozwi\u0105zanie? Ot\u00f3\u017c od czasu do czasu warto wyj\u015b\u0107 poza stref\u0119 komfortu i wydeptane \u015bcie\u017cki i zerkn\u0105\u0107 na alternatywne rozwi\u0105zania. Mo\u017ce w ci\u0105gu kilku najbli\u017cszych lat (o ile w og\u00f3le) nie znajdziecie pracy w SolidJS, to taka podr\u00f3\u017c mo\u017ce odrobin\u0119 zmieni\u0107 to jak piszecie sw\u00f3j kod w Angularze, Vue czy Reactie. Je\u015bli Was przekona\u0142em to w \u017ar\u00f3d\u0142ach znajdziecie ca\u0142kiem niez\u0142y zestaw tutoriali, idealnych do przerobienia w czwartkowy wiecz\u00f3r<\/p>\n<figure class=\"kg-card kg-code-card\">\n<pre><code class=\"language-ts\">import { createEffect, For } from &quot;solid-js&quot;;\nimport { createStore, SetStoreFunction, Store } from &quot;solid-js\/store&quot;;\nimport { render } from &quot;solid-js\/web&quot;;\nfunction createLocalStore&lt;T&gt;(initState: T): [Store&lt;T&gt;, SetStoreFunction&lt;T&gt;] {\n\tconst [state, setState] = createStore(initState);\n\tif (localStorage.todos) setState(JSON.parse(localStorage.todos));\n\tcreateEffect(() =&gt; (localStorage.todos = JSON.stringify(state)));\n\treturn [state, setState];\n}\nconst App = () =&gt; {\n\tconst [state, setState] = createLocalStore({\n\t\ttodos: [],\n\t\tnewTitle: &quot;&quot;\n\t});\n\treturn (\n\t\t&lt;&gt;\n\t\t\t&lt;h3&gt;Simple Todos Example&lt;\/h3&gt;\n\t\t\t&lt;input\n\t\t\t\ttype=&quot;text&quot;\n\t\t\t\tplaceholder=&quot;enter todo and click +&quot;\n\t\t\t\tvalue={state.newTitle}\n\t\t\t\tonInput={(e) =&gt; setState({ newTitle: e.target.value })}\n\t\t\t\/&gt;\n\t\t\t&lt;button\n\t\t\t\tonClick={() =&gt;\n\t\t\t\t\tsetState({\n\t\t\t\t\t\ttodos: [\n\t\t\t\t\t\t\t...state.todos,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: state.newTitle,\n\t\t\t\t\t\t\t\tdone: false\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t],\n\t\t\t\t\t\tnewTitle: &quot;&quot;\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t&gt;\n\t\t\t\t+\n\t\t\t&lt;\/button&gt;\n\t\t\t&lt;For each={state.todos}&gt;\n\t\t\t\t{(todo, i) =&gt; {\n\t\t\t\t\tconst { done, title } = todo;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t&lt;div&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=&quot;checkbox&quot;\n\t\t\t\t\t\t\t\tchecked={done}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(&quot;todos&quot;, i(), { done: e.target.checked })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=&quot;text&quot;\n\t\t\t\t\t\t\t\tvalue={title}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(&quot;todos&quot;, i(), { title: e.target.value })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;button\n\t\t\t\t\t\t\t\tonClick={() =&gt;\n\t\t\t\t\t\t\t\t\tsetState(&quot;todos&quot;, (t) =&gt; [\n\t\t\t\t\t\t\t\t\t\t...t.slice(0, i()),\n\t\t\t\t\t\t\t\t\t\t...t.slice(i() + 1)\n\t\t\t\t\t\t\t\t\t])\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t&gt;\n\t\t\t\t\t\t\t\tx\n\t\t\t\t\t\t\t&lt;\/button&gt;\n\t\t\t\t\t\t&lt;\/div&gt;\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t&lt;\/For&gt;\n\t\t&lt;\/&gt;\n\t);\n};\nrender(App, document.getElementById(&quot;app&quot;));<\/code><\/pre><figcaption>SolidJS na pierwszy rzut oka wygl\u0105da bardzo podobnie do Reacta, ale je\u015bli przyjrzycie si\u0119 dok\u0142adniej, to znajdziecie kilka r\u00f3\u017cnic \ud83d\ude09<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-2\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd\">https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd<\/a><br \/>\n<a href=\"https:\/\/www.solidjs.com\/tutorial\/introduction_basics\">https:\/\/www.solidjs.com\/tutorial\/introduction_basics<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>W tym tygodniu mamy dla Was du\u017ce zmiany nadchodz\u0105ce do Microsoft Teams, Google op\u00f3\u017aniaj\u0105ce wdro\u017cenie algorytmu FloC i nowy framework: SolidJS.<\/p>\n","protected":false},"author":12,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[273],"tags":[],"class_list":["post-10117","post","type-post","status-publish","format-standard","hentry","category-frontend-pl"],"acf":{"weekly_summary":true,"estimated_reading_time":"4"},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Frontend Thursday vol. 44 - 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\/frontend-thursday-vol-44\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Frontend Thursday vol. 44 - Vived\" \/>\n<meta property=\"og:description\" content=\"W tym tygodniu mamy dla Was du\u017ce zmiany nadchodz\u0105ce do Microsoft Teams, Google op\u00f3\u017aniaj\u0105ce wdro\u017cenie algorytmu FloC i nowy framework: SolidJS.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\" \/>\n<meta property=\"og:site_name\" content=\"Vived\" \/>\n<meta property=\"article:published_time\" content=\"2021-07-01T15:27:04+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-19T11:16:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\" \/>\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\/frontend-thursday-vol-44\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\"},\"author\":{\"name\":\"Tomasz Borowicz\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\"},\"headline\":\"Frontend Thursday vol. 44\",\"datePublished\":\"2021-07-01T15:27:04+00:00\",\"dateModified\":\"2022-09-19T11:16:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\"},\"wordCount\":643,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\",\"articleSection\":[\"Frontend\"],\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\",\"url\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\",\"name\":\"Frontend Thursday vol. 44 - Vived\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\",\"datePublished\":\"2021-07-01T15:27:04+00:00\",\"dateModified\":\"2022-09-19T11:16:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/vived.io\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Frontend Thursday vol. 44\"}]},{\"@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":"Frontend Thursday vol. 44 - 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\/frontend-thursday-vol-44\/","og_locale":"pl_PL","og_type":"article","og_title":"Frontend Thursday vol. 44 - Vived","og_description":"W tym tygodniu mamy dla Was du\u017ce zmiany nadchodz\u0105ce do Microsoft Teams, Google op\u00f3\u017aniaj\u0105ce wdro\u017cenie algorytmu FloC i nowy framework: SolidJS.","og_url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/","og_site_name":"Vived","article_published_time":"2021-07-01T15:27:04+00:00","article_modified_time":"2022-09-19T11:16:41+00:00","og_image":[{"url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif","type":"","width":"","height":""}],"author":"Tomasz Borowicz","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#article","isPartOf":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/"},"author":{"name":"Tomasz Borowicz","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb"},"headline":"Frontend Thursday vol. 44","datePublished":"2021-07-01T15:27:04+00:00","dateModified":"2022-09-19T11:16:41+00:00","mainEntityOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/"},"wordCount":643,"commentCount":0,"publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif","articleSection":["Frontend"],"inLanguage":"pl-PL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/","url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/","name":"Frontend Thursday vol. 44 - Vived","isPartOf":{"@id":"https:\/\/vived.io\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif","datePublished":"2021-07-01T15:27:04+00:00","dateModified":"2022-09-19T11:16:41+00:00","breadcrumb":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#primaryimage","url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif"},{"@type":"BreadcrumbList","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-44\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/vived.io\/pl\/"},{"@type":"ListItem","position":2,"name":"Frontend Thursday vol. 44"}]},{"@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":null,"attrs":[],"innerBlocks":[],"innerHTML":"<h1 id=\"1-microsoft-teams-20\">1. Microsoft Teams 2.0<\/h1>\nMicrosoft Teams to aplikacja, kt\u00f3ra dzi\u0119ki pandemii zdoby\u0142a globaln\u0105 rozpoznawalno\u015b\u0107. Jest to te\u017c jedna z sztandarowych aplikacji wymienianych jako przyk\u0142ad wdro\u017cenia Electrona na produkcji. No c\u00f3\u017c, nied\u0142ugo stan rzeczy si\u0119 zmieni, bo w minionym tygodniu CVP Microsoftu (je\u015bli te\u017c zastanawiacie si\u0119 jak rozwin\u0105\u0107 ten korporacyjny skr\u00f3t, to chodzi tu o Corporate Vice President) pochwali\u0142 si\u0119 na Twitterze, \u017ce wkr\u00f3tce flagowy komunikator firmy z Redmont dostanie aktualizacj\u0119 zast\u0119puj\u0105c\u0105 Electrona Edge Webview2. Z czego wynika takie posuni\u0119cie? Electron znany jest z zasobo\u017cerno\u015bci, szczeg\u00f3lnie je\u015bli chodzi o RAM. Microsoft posiada nawet <a href=\"https:\/\/docs.microsoft.com\/en-us\/microsoftteams\/teams-memory-usage-perf\">stron\u0119 w dokumentacji<\/a> wyja\u015bniaj\u0105c\u0105 z czego wynika takie zu\u017cycie pami\u0119ci (TLDR: Chromium w celu optymalizacji rezerwuje sobie tak du\u017co pami\u0119ci jak to tylko mo\u017cliwe). Nowe rozwi\u0105zanie to autorski tw\u00f3r microsoftu, kt\u00f3ry opr\u00f3cz lepszego zarz\u0105dzania zasobami oferuje te\u017c Evergreen Distribution, czyli mo\u017cliwo\u015b\u0107 utrzymania u\u017cytkownik\u00f3w z najnowsz\u0105 wersj\u0105 przegl\u0105darki. Wszystko jest o tyle ciekawe, \u017ce Edge r\u00f3wnie\u017c pod spodem bazuje na Chromium.\n\nNowa wersja teams\u00f3w przynosi te\u017c jedn\u0105 nowo\u015b\u0107, kt\u00f3ra szczeg\u00f3lnie boli moje Angularowe serducho: ca\u0142o\u015b\u0107 aplikacji zosta\u0142a przepisana z Angulara na Reacta. Mam nadziej\u0119, \u017c\u0119 in\u017cynierowie z Microsoftu podziel\u0105 si\u0119 kiedy\u015b artyku\u0142em, w kt\u00f3rym wyja\u015bni\u0105 powody podj\u0119cia takiej decyzji.\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\" alt=\"\" \/>\n<figcaption>Standardowy mem o Chrom\u0119. Naprawd\u0119 obiecuj\u0119, \u017ce to ju\u017c ostatni raz\u00a0<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/\">https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/<\/a>\n<a href=\"https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/\">https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/<\/a>\n<h1 id=\"2-google-op%C3%B3%C5%BAnia-floc-do-2023\">2. Google op\u00f3\u017ania FLoC do 2023<\/h1>\nFLoC to temat, o kt\u00f3rym szerzej rozpisywa\u0142em si\u0119 <a href=\"https:\/\/blog.vived.io\/frontend-thursday-vol-33\/\">w edycji 33<\/a> naszego przegl\u0105du, ale gwoli \u015bcis\u0142o\u015bci postaram si\u0119 w dw\u00f3ch zdaniach przypomnie\u0107 o co chodzi. Ot\u00f3\u017c Google opracowa\u0142 algorytm klastruj\u0105cych u\u017cytkownik\u00f3w lokalnie na ich maszynach. W teorii wszystko brzmi \u015bwietnie, ale po przygl\u0105dni\u0119ciu si\u0119 bli\u017cej, rozwi\u0105zanie to raczej pogarsza ni\u017c poprawia prywatno\u015b\u0107 u\u017cytkownik\u00f3w. W tym kontek\u015bcie na pewno cieszy fakt, \u017ce Google postanowi\u0142 p\u00f3ki co wstrzyma\u0107 si\u0119 z globalnym wdro\u017ceniem algorytmu w Chrome do 2023 roku. Dodatkowy czas Google zamierza wykorzysta\u0107 na rozpocz\u0119ciu publicznej dyskusji dotycz\u0105cych prywatno\u015bci w kontek\u015bcie personalizacji reklam jak i negocjacjach z innymi du\u017cymi graczami w \u015bwiecie przegl\u0105darek i e-commerce.\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091abe093.gif\" alt=\"\" \/>\n\n<figcaption>Je\u015bli ju\u017c nawet sam Google po cichu przyznaje, \u017ce FLoC ma swoje wady, to znaczy, \u017ce nad algorytmem naprawd\u0119 zacz\u0119\u0142y rozci\u0105ga\u0107 si\u0119 ciemne chmury. CIekawe tylko jak Google wybrnie teraz z tego problemu.<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-1\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/\">https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/<\/a>\n<h1 id=\"3-solidjs\">3. SolidJS<\/h1>\nJak g\u0142osi stare programistyczne porzekad\u0142o: tydzie\u0144 bez nowego javascriptowego frameworku to tydzie\u0144 stracony. Po prawie roku tworzenia naszych frontendowych przegl\u0105d\u00f3w jestem pewien, \u017ce mocno mija si\u0119 ono z prawd\u0105, ale w tym tygodniu rzeczywi\u015bcie na rynku pojawi\u0142 si\u0119 nowy gracz, kt\u00f3ry wzbudzi\u0142 troch\u0119 zamieszania. Raczej nie przebije si\u0119 on do czo\u0142owej tr\u00f3jki frontendowych framework\u00f3w. Ba, my\u015bl\u0119, \u017ce pozycja czwartego Svelte r\u00f3wnie\u017c nie jest na razie zagro\u017cona. Dlaczego wi\u0119c podrzucamy Wam to rozwi\u0105zanie? Ot\u00f3\u017c od czasu do czasu warto wyj\u015b\u0107 poza stref\u0119 komfortu i wydeptane \u015bcie\u017cki i zerkn\u0105\u0107 na alternatywne rozwi\u0105zania. Mo\u017ce w ci\u0105gu kilku najbli\u017cszych lat (o ile w og\u00f3le) nie znajdziecie pracy w SolidJS, to taka podr\u00f3\u017c mo\u017ce odrobin\u0119 zmieni\u0107 to jak piszecie sw\u00f3j kod w Angularze, Vue czy Reactie. Je\u015bli Was przekona\u0142em to w \u017ar\u00f3d\u0142ach znajdziecie ca\u0142kiem niez\u0142y zestaw tutoriali, idealnych do przerobienia w czwartkowy wiecz\u00f3r\n<figure class=\"kg-card kg-code-card\">\n<pre><code class=\"language-ts\">import { createEffect, For } from \"solid-js\";\nimport { createStore, SetStoreFunction, Store } from \"solid-js\/store\";\nimport { render } from \"solid-js\/web\";\nfunction createLocalStore&lt;T&gt;(initState: T): [Store&lt;T&gt;, SetStoreFunction&lt;T&gt;] {\n\tconst [state, setState] = createStore(initState);\n\tif (localStorage.todos) setState(JSON.parse(localStorage.todos));\n\tcreateEffect(() =&gt; (localStorage.todos = JSON.stringify(state)));\n\treturn [state, setState];\n}\nconst App = () =&gt; {\n\tconst [state, setState] = createLocalStore({\n\t\ttodos: [],\n\t\tnewTitle: \"\"\n\t});\n\treturn (\n\t\t&lt;&gt;\n\t\t\t&lt;h3&gt;Simple Todos Example&lt;\/h3&gt;\n\t\t\t&lt;input\n\t\t\t\ttype=\"text\"\n\t\t\t\tplaceholder=\"enter todo and click +\"\n\t\t\t\tvalue={state.newTitle}\n\t\t\t\tonInput={(e) =&gt; setState({ newTitle: e.target.value })}\n\t\t\t\/&gt;\n\t\t\t&lt;button\n\t\t\t\tonClick={() =&gt;\n\t\t\t\t\tsetState({\n\t\t\t\t\t\ttodos: [\n\t\t\t\t\t\t\t...state.todos,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: state.newTitle,\n\t\t\t\t\t\t\t\tdone: false\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t],\n\t\t\t\t\t\tnewTitle: \"\"\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t&gt;\n\t\t\t\t+\n\t\t\t&lt;\/button&gt;\n\t\t\t&lt;For each={state.todos}&gt;\n\t\t\t\t{(todo, i) =&gt; {\n\t\t\t\t\tconst { done, title } = todo;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t&lt;div&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tchecked={done}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", i(), { done: e.target.checked })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tvalue={title}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", i(), { title: e.target.value })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;button\n\t\t\t\t\t\t\t\tonClick={() =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", (t) =&gt; [\n\t\t\t\t\t\t\t\t\t\t...t.slice(0, i()),\n\t\t\t\t\t\t\t\t\t\t...t.slice(i() + 1)\n\t\t\t\t\t\t\t\t\t])\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t&gt;\n\t\t\t\t\t\t\t\tx\n\t\t\t\t\t\t\t&lt;\/button&gt;\n\t\t\t\t\t\t&lt;\/div&gt;\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t&lt;\/For&gt;\n\t\t&lt;\/&gt;\n\t);\n};\nrender(App, document.getElementById(\"app\"));<\/code><\/pre>\n<figcaption>SolidJS na pierwszy rzut oka wygl\u0105da bardzo podobnie do Reacta, ale je\u015bli przyjrzycie si\u0119 dok\u0142adniej, to znajdziecie kilka r\u00f3\u017cnic ;)<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-2\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd\">https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd<\/a>\n<a href=\"https:\/\/www.solidjs.com\/tutorial\/introduction_basics\">https:\/\/www.solidjs.com\/tutorial\/introduction_basics<\/a>","innerContent":["<h1 id=\"1-microsoft-teams-20\">1. Microsoft Teams 2.0<\/h1>\nMicrosoft Teams to aplikacja, kt\u00f3ra dzi\u0119ki pandemii zdoby\u0142a globaln\u0105 rozpoznawalno\u015b\u0107. Jest to te\u017c jedna z sztandarowych aplikacji wymienianych jako przyk\u0142ad wdro\u017cenia Electrona na produkcji. No c\u00f3\u017c, nied\u0142ugo stan rzeczy si\u0119 zmieni, bo w minionym tygodniu CVP Microsoftu (je\u015bli te\u017c zastanawiacie si\u0119 jak rozwin\u0105\u0107 ten korporacyjny skr\u00f3t, to chodzi tu o Corporate Vice President) pochwali\u0142 si\u0119 na Twitterze, \u017ce wkr\u00f3tce flagowy komunikator firmy z Redmont dostanie aktualizacj\u0119 zast\u0119puj\u0105c\u0105 Electrona Edge Webview2. Z czego wynika takie posuni\u0119cie? Electron znany jest z zasobo\u017cerno\u015bci, szczeg\u00f3lnie je\u015bli chodzi o RAM. Microsoft posiada nawet <a href=\"https:\/\/docs.microsoft.com\/en-us\/microsoftteams\/teams-memory-usage-perf\">stron\u0119 w dokumentacji<\/a> wyja\u015bniaj\u0105c\u0105 z czego wynika takie zu\u017cycie pami\u0119ci (TLDR: Chromium w celu optymalizacji rezerwuje sobie tak du\u017co pami\u0119ci jak to tylko mo\u017cliwe). Nowe rozwi\u0105zanie to autorski tw\u00f3r microsoftu, kt\u00f3ry opr\u00f3cz lepszego zarz\u0105dzania zasobami oferuje te\u017c Evergreen Distribution, czyli mo\u017cliwo\u015b\u0107 utrzymania u\u017cytkownik\u00f3w z najnowsz\u0105 wersj\u0105 przegl\u0105darki. Wszystko jest o tyle ciekawe, \u017ce Edge r\u00f3wnie\u017c pod spodem bazuje na Chromium.\n\nNowa wersja teams\u00f3w przynosi te\u017c jedn\u0105 nowo\u015b\u0107, kt\u00f3ra szczeg\u00f3lnie boli moje Angularowe serducho: ca\u0142o\u015b\u0107 aplikacji zosta\u0142a przepisana z Angulara na Reacta. Mam nadziej\u0119, \u017c\u0119 in\u017cynierowie z Microsoftu podziel\u0105 si\u0119 kiedy\u015b artyku\u0142em, w kt\u00f3rym wyja\u015bni\u0105 powody podj\u0119cia takiej decyzji.\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091a33862.gif\" alt=\"\" \/>\n<figcaption>Standardowy mem o Chrom\u0119. Naprawd\u0119 obiecuj\u0119, \u017ce to ju\u017c ostatni raz\u00a0<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/\">https:\/\/tomtalks.blog\/2021\/06\/microsoft-teams-2-0-will-use-half-the-memory-dropping-electron-for-edge-webview2\/<\/a>\n<a href=\"https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/\">https:\/\/blogs.windows.com\/msedgedev\/2020\/10\/19\/edge-webview2-general-availability\/<\/a>\n<h1 id=\"2-google-op%C3%B3%C5%BAnia-floc-do-2023\">2. Google op\u00f3\u017ania FLoC do 2023<\/h1>\nFLoC to temat, o kt\u00f3rym szerzej rozpisywa\u0142em si\u0119 <a href=\"https:\/\/blog.vived.io\/frontend-thursday-vol-33\/\">w edycji 33<\/a> naszego przegl\u0105du, ale gwoli \u015bcis\u0142o\u015bci postaram si\u0119 w dw\u00f3ch zdaniach przypomnie\u0107 o co chodzi. Ot\u00f3\u017c Google opracowa\u0142 algorytm klastruj\u0105cych u\u017cytkownik\u00f3w lokalnie na ich maszynach. W teorii wszystko brzmi \u015bwietnie, ale po przygl\u0105dni\u0119ciu si\u0119 bli\u017cej, rozwi\u0105zanie to raczej pogarsza ni\u017c poprawia prywatno\u015b\u0107 u\u017cytkownik\u00f3w. W tym kontek\u015bcie na pewno cieszy fakt, \u017ce Google postanowi\u0142 p\u00f3ki co wstrzyma\u0107 si\u0119 z globalnym wdro\u017ceniem algorytmu w Chrome do 2023 roku. Dodatkowy czas Google zamierza wykorzysta\u0107 na rozpocz\u0119ciu publicznej dyskusji dotycz\u0105cych prywatno\u015bci w kontek\u015bcie personalizacji reklam jak i negocjacjach z innymi du\u017cymi graczami w \u015bwiecie przegl\u0105darek i e-commerce.\n<figure class=\"kg-card kg-image-card kg-card-hascaption\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d091abe093.gif\" alt=\"\" \/>\n\n<figcaption>Je\u015bli ju\u017c nawet sam Google po cichu przyznaje, \u017ce FLoC ma swoje wady, to znaczy, \u017ce nad algorytmem naprawd\u0119 zacz\u0119\u0142y rozci\u0105ga\u0107 si\u0119 ciemne chmury. CIekawe tylko jak Google wybrnie teraz z tego problemu.<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-1\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/\">https:\/\/arstechnica.com\/gadgets\/2021\/06\/google-delays-floc-rollout-until-2023\/<\/a>\n<h1 id=\"3-solidjs\">3. SolidJS<\/h1>\nJak g\u0142osi stare programistyczne porzekad\u0142o: tydzie\u0144 bez nowego javascriptowego frameworku to tydzie\u0144 stracony. Po prawie roku tworzenia naszych frontendowych przegl\u0105d\u00f3w jestem pewien, \u017ce mocno mija si\u0119 ono z prawd\u0105, ale w tym tygodniu rzeczywi\u015bcie na rynku pojawi\u0142 si\u0119 nowy gracz, kt\u00f3ry wzbudzi\u0142 troch\u0119 zamieszania. Raczej nie przebije si\u0119 on do czo\u0142owej tr\u00f3jki frontendowych framework\u00f3w. Ba, my\u015bl\u0119, \u017ce pozycja czwartego Svelte r\u00f3wnie\u017c nie jest na razie zagro\u017cona. Dlaczego wi\u0119c podrzucamy Wam to rozwi\u0105zanie? Ot\u00f3\u017c od czasu do czasu warto wyj\u015b\u0107 poza stref\u0119 komfortu i wydeptane \u015bcie\u017cki i zerkn\u0105\u0107 na alternatywne rozwi\u0105zania. Mo\u017ce w ci\u0105gu kilku najbli\u017cszych lat (o ile w og\u00f3le) nie znajdziecie pracy w SolidJS, to taka podr\u00f3\u017c mo\u017ce odrobin\u0119 zmieni\u0107 to jak piszecie sw\u00f3j kod w Angularze, Vue czy Reactie. Je\u015bli Was przekona\u0142em to w \u017ar\u00f3d\u0142ach znajdziecie ca\u0142kiem niez\u0142y zestaw tutoriali, idealnych do przerobienia w czwartkowy wiecz\u00f3r\n<figure class=\"kg-card kg-code-card\">\n<pre><code class=\"language-ts\">import { createEffect, For } from \"solid-js\";\nimport { createStore, SetStoreFunction, Store } from \"solid-js\/store\";\nimport { render } from \"solid-js\/web\";\nfunction createLocalStore&lt;T&gt;(initState: T): [Store&lt;T&gt;, SetStoreFunction&lt;T&gt;] {\n\tconst [state, setState] = createStore(initState);\n\tif (localStorage.todos) setState(JSON.parse(localStorage.todos));\n\tcreateEffect(() =&gt; (localStorage.todos = JSON.stringify(state)));\n\treturn [state, setState];\n}\nconst App = () =&gt; {\n\tconst [state, setState] = createLocalStore({\n\t\ttodos: [],\n\t\tnewTitle: \"\"\n\t});\n\treturn (\n\t\t&lt;&gt;\n\t\t\t&lt;h3&gt;Simple Todos Example&lt;\/h3&gt;\n\t\t\t&lt;input\n\t\t\t\ttype=\"text\"\n\t\t\t\tplaceholder=\"enter todo and click +\"\n\t\t\t\tvalue={state.newTitle}\n\t\t\t\tonInput={(e) =&gt; setState({ newTitle: e.target.value })}\n\t\t\t\/&gt;\n\t\t\t&lt;button\n\t\t\t\tonClick={() =&gt;\n\t\t\t\t\tsetState({\n\t\t\t\t\t\ttodos: [\n\t\t\t\t\t\t\t...state.todos,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\ttitle: state.newTitle,\n\t\t\t\t\t\t\t\tdone: false\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t],\n\t\t\t\t\t\tnewTitle: \"\"\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t&gt;\n\t\t\t\t+\n\t\t\t&lt;\/button&gt;\n\t\t\t&lt;For each={state.todos}&gt;\n\t\t\t\t{(todo, i) =&gt; {\n\t\t\t\t\tconst { done, title } = todo;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t&lt;div&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\tchecked={done}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", i(), { done: e.target.checked })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;input\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tvalue={title}\n\t\t\t\t\t\t\t\tonChange={(e) =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", i(), { title: e.target.value })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\/&gt;\n\t\t\t\t\t\t\t&lt;button\n\t\t\t\t\t\t\t\tonClick={() =&gt;\n\t\t\t\t\t\t\t\t\tsetState(\"todos\", (t) =&gt; [\n\t\t\t\t\t\t\t\t\t\t...t.slice(0, i()),\n\t\t\t\t\t\t\t\t\t\t...t.slice(i() + 1)\n\t\t\t\t\t\t\t\t\t])\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t&gt;\n\t\t\t\t\t\t\t\tx\n\t\t\t\t\t\t\t&lt;\/button&gt;\n\t\t\t\t\t\t&lt;\/div&gt;\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t&lt;\/For&gt;\n\t\t&lt;\/&gt;\n\t);\n};\nrender(App, document.getElementById(\"app\"));<\/code><\/pre>\n<figcaption>SolidJS na pierwszy rzut oka wygl\u0105da bardzo podobnie do Reacta, ale je\u015bli przyjrzycie si\u0119 dok\u0142adniej, to znajdziecie kilka r\u00f3\u017cnic ;)<\/figcaption><\/figure>\n<h3 id=\"%C5%BAr%C3%B3d%C5%82a-2\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd\">https:\/\/dev.to\/ryansolid\/solidjs-official-release-the-long-road-to-1-0-4ldd<\/a>\n<a href=\"https:\/\/www.solidjs.com\/tutorial\/introduction_basics\">https:\/\/www.solidjs.com\/tutorial\/introduction_basics<\/a>"]}],"_links":{"self":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10117","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=10117"}],"version-history":[{"count":1,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10117\/revisions"}],"predecessor-version":[{"id":10633,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10117\/revisions\/10633"}],"wp:attachment":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media?parent=10117"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/categories?post=10117"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/tags?post=10117"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}