{"id":10166,"date":"2021-03-18T10:30:00","date_gmt":"2021-03-18T09:30:00","guid":{"rendered":"https:\/\/vived.io\/frontend-thursday-vol-29\/"},"modified":"2022-09-19T13:23:08","modified_gmt":"2022-09-19T11:23:08","slug":"frontend-thursday-vol-29","status":"publish","type":"post","link":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/","title":{"rendered":"Frontend Thursday vol. 29"},"content":{"rendered":"<h1 id=\"1-just-in-time-the-next-generation-of-tailwind-css\">1. Just-In-Time: The Next Generation of Tailwind CSS<\/h1>\n<p>Pojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego w sieci zainteresowania, a w kategorii wdro\u017cenia na produkcj\u0119 zaliczy\u0142 imponuj\u0105cy wzrost z 9 na 4 miejsce. Nawet je\u015bli na pierwszy rzut oka nie przemawia do Was podej\u015bcie utility-first, to i tak dajcie mu szans\u0119 &#8211; w sieci natkn\u0105\u0142em si\u0119 przynajmniej na kilka os\u00f3b, kt\u00f3re zaczyna\u0142y z sceptycznym nastawieniem i ko\u0144czy\u0142y kompletnie zakochane.<\/p>\n<p>Wr\u00f3\u0107my tymczasem do g\u0142\u00f3wnego tematu, czyli nowego kompilatora Tailwinda. Do tej pory w trybie deweloperskim do przegl\u0105darki dostarczany by\u0142 poka\u017any plik zawieraj\u0105cy ca\u0142ego Tailwinda (czasami maj\u0105cego nawet 10MB!). W trybie produkcyjnym natomiast standardem by\u0142o odchudzanie paczki przy pomocy PurgeCSS.Zale\u017cno\u015b\u0107 ta &nbsp;przy pomocy RegeExpa wyszukiwa\u0142a wszystkie klasy znajduj\u0105ce si\u0119 w templateach jeszcze na etapie budowania (roch\u0119 wi\u0119cej na ten temat znajdziecie w samej <a href=\"https:\/\/tailwindcss.com\/docs\/optimizing-for-production\">dokumentacji)<\/a>. Kompilator Just-In-Time zupe\u0142nie zmienia to zachowanie. Od teraz zar\u00f3wno w trybie produkcyjnym, jak i deweloperskim wraz z dodaniem kolejnej klasy do elementu, b\u0119dzie si\u0119 ona dynamicznie pojawia\u0107 w wynikowych plikach stylu. Nie wp\u0142ynie to znacz\u0105co na rozmiar bundla, ale za to mocno poprawi developer experience &#8211; w trakcie developmentu przegl\u0105darka b\u0119dzie musia\u0142a obs\u0142ugiwa\u0107 o rz\u0105d wielko\u015bci mniejszy plik CSS.<\/p>\n<p>Nie s\u0105 to (niestety) jedyne zmiany, jakie wprowadza nowy kompilator. &nbsp;Nowy spos\u00f3b generowania klas umo\u017cliwia specyfikacj\u0119 jednostek w pikselach i kolor\u00f3w w postaci hexa.<\/p>\n<pre><code class=\"language-html\">&lt;!-- Sizes and positioning --&gt;\n&lt;img class=&quot;absolute w-[762px] h-[918px] top-[-325px] right-[62px] md:top-[-400px] md:right-[80px]&quot; src=&quot;\/crazy-background-image.png&quot;&gt;\n&lt;!-- Colors --&gt;\n&lt;button class=&quot;bg-[#1da1f1]&quot;&gt;Share on Twitter&lt;\/button&gt;\n&lt;!-- Complex grids --&gt;\n&lt;div class=&quot;grid-cols-[1fr,700px,2fr]&quot;&gt;\n  &lt;!-- ... --&gt;\n&lt;\/div&gt;<\/code><\/pre>\n<p>Na pewno jest to rozwi\u0105zanie wygodne, ale w moich oczach a\u017c nazbyt wygodne. Argument tw\u00f3rcy kompilatora, m\u00f3wi\u0105cy o synergii tego rozwi\u0105zania z Tailwindowymi breakpointami, jak najbardziej do mnie przemawia (do tej pory je\u015bli chcieli\u015bmy nada\u0107 w\u0142asny styl w zale\u017cno\u015bci od wielko\u015bci ekranu, nale\u017ca\u0142o zduplikowa\u0107 element i wykorzysta\u0107 klas\u0119 {breakpoint}:visible). Obawiam si\u0119 tylko, \u017ce bez trzymania odpowiedniej dyscypliny taka funkcjonalno\u015b\u0107 mo\u017ce doprowadzi\u0107 do zalania naszego kodu magicznymi liczbami i kolorami. Wielu programist\u00f3w na breakpointach zapewne si\u0119 nie zatrzyma\u2026 No c\u00f3\u017c, mo\u017ce moja wiara w programistyczna bra\u0107 jest zbyt ma\u0142a i taka funkcjonalno\u015b\u0107 jednak nie wp\u0142ynie negatywnie na code basy u\u017cywaj\u0105ce Tailwinda? Czas poka\u017ce&#8230;<\/p>\n<figure class=\"kg-card kg-image-card\"><img decoding=\"async\" class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\" alt=\"\"><\/figure>\n<h3 id=\"-r-d-a-\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css\">https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css<\/a><\/p>\n<h1 id=\"2-updates-from-the-81st-meeting-of-tc39\">2. Updates from the 81st meeting of TC39<\/h1>\n<p>W tym tygodniu mia\u0142o r\u00f3wnie\u017c miejsce zebranie JavaScriptowej starszyzny, czyli TC39 Meeting (je\u015bli zastanawiacie si\u0119, czy por\u00f3wnywanie TC39 do india\u0144skiej starszyzny kiedykolwiek mi si\u0119 znudzi to \u015bpiesz\u0119 z wyja\u015bnieniem: nie). Je\u015bli \u015bledzicie nasze JVM-owe podsumowania, to pewnie orientujecie si\u0119, nad jakimi funkcjonalno\u015bciami trwaj\u0105 w tym \u015brodowisku prace: rekordy, pattern matching, wsp\u00f3\u0142bie\u017cno\u015b\u0107. Je\u015bli natomiast przyjrze\u0107 si\u0119, nad czym pracuje si\u0119 w \u015brodowisku JavaScriptowym, to ci\u0119\u017cko nie odnie\u015b\u0107 wra\u017cenia, \u017ce m\u00f3wimy o j\u0119zyku rozwijaj\u0105cym si\u0119 zdecydowanie mniej pr\u0119\u017cnie. Po raz kolejny najwa\u017cniejszym tematem omawianym podczas spotkania by\u0142y funkcje dotycz\u0105ce ulepszenia obs\u0142ugi czasu i daty. Zdecydowanie jest to temat istotny, no ale ile mo\u017cna\u2026<\/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_610d0bb85e712.gif\" alt=\"\"><figcaption>Gdyby featury omawiane na TC39 Meetings by\u0142y memem<\/figcaption><\/figure>\n<p>Sko\u0144czmy jednak narzeka\u0107 i zerknijmy na to, w jaki spos\u00f3b tym razem zaatakowano ten problem. Do etapu trzeciego prac nad specyfikacj\u0105 JavaScript trafi\u0142 obiekt Temporal. Ma on by\u0107 dost\u0119pny globalnie &#8211; podobnie jak znany wi\u0119kszo\u015bci obiekt Math. Temporal ma udost\u0119pnia\u0107 API do wygodnego operowania na datach, stawiaj\u0105c na obs\u0142ug\u0119 stref czasowych i r\u00f3\u017cnych rodzaj\u00f3w kalendarzy (pisa\u0142 kto\u015b z Was kiedy\u015b aplikacj\u0119 wspieraj\u0105c\u0105 <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Kalendarz_%C5%BCydowski\">kalendarz \u017cydowski<\/a> albo <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Era_buddyjska\">kalendarz buddyjski<\/a>?). API jest na tyle rozbudowane, \u017ce nie ma sensu dzieli\u0107 si\u0119 nim w tym blogpo\u015bcie wi\u0119c wszystkich zainteresowanych odsy\u0142am do \u017ar\u00f3d\u0142a.<\/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_610d0bb8c7084.png\" alt=\"\">&nbsp;<figcaption>Schemat w jaki Temporal b\u0119dzie zapisywa\u0142 daty<\/figcaption><\/figure>\n<h3 id=\"-r-d-a--1\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p\">https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p<\/a><\/p>\n<h1 id=\"3-introducing-relay-hooks-improved-react-apis-for-relay\">3. Introducing Relay Hooks: Improved React APIs for Relay<\/h1>\n<p>Na pocz\u0105tku przyznam si\u0119, \u017ce GraphQL to jeden z tych poci\u0105g\u00f3w, kt\u00f3ry odjecha\u0142 beze mnie. Nigdy nie mia\u0142em okazji pobawi\u0107 si\u0119 tym narz\u0119dziem w bardziej zaawansowanym projekcie i moja wiedza nigdy nie wysz\u0142a poza proste tutoriale. Z racji tego bardzo ci\u0119\u017cko jest mi zar\u00f3wno por\u00f3wna\u0107 Appollo do Relay (patrz\u0105c tylko na pobrania z npm to Apollo wygrywa oko\u0142o trzykrotnie) i oceni\u0107, jak du\u017ce usprawnienia wprowadzi\u0142 Facebook w swoim kliencie (kt\u00f3ry btw wykorzystywany jest w nowej wersji webowego Facebooka, wi\u0119c bez w\u0105tpienia jest to co\u015b production ready). Je\u015bli jest z nami kto\u015b, kto ma na ten temat lepsz\u0105 wiedz\u0119, b\u0105d\u017a ciekaw\u0105 opini\u0119 to zapraszamy do komentowania na <a href=\"https:\/\/www.facebook.com\/vivedapp\">naszym Facebooku<\/a> (z odrobin\u0105 szcz\u0119\u015bcia mo\u017ce nawet zostanie zacytowani w tym blogpo\u015bcie). Ja tymczasem zostawiam Was z blogpostem opisuj\u0105cym now\u0105 wersj\u0119 Relay, bo zdecydowanie jest to du\u017ce wydarzenie dla wszystkich korzystaj\u0105cych z GraphQL.<\/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_610d0bba196a1.jpg\" alt=\"\">&nbsp;<figcaption>Autor frontendowego czwartku widz\u0105c newsa o nowej wersji Relay<\/figcaption><\/figure>\n<p>PS. Wertuj\u0105c informacje o Relay i GraphQL odkopa\u0142em \u015bwietny dokument o powstawaniu GraphQL. Je\u015bli jeszcze nie widzieli\u015bcie i macie wolne p\u00f3\u0142 godziny, to gor\u0105co polecam.<\/p>\n<div class=\"embed-responsive embed-responsive-16by9\"><iframe loading=\"lazy\" title=\"GraphQL: The Documentary\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/783ccP__No8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<h3 id=\"-r-d-a--2\">\u0179r\u00f3d\u0142a:<\/h3>\n<p><a href=\"https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/\">https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/<\/a><\/p>\n<hr>\n<p>Pami\u0119tajcie, \u017ceby spr\u00f3bowa\u0107 <a href=\"https:\/\/blog.vived.io\/software-craftsmanship-saturday\/vived.io\">Vived<\/a>, je\u015bli chcesz otrzymywa\u0107 tego typu tre\u015bci spersonalizowane pod Ciebie!<\/p>\n<ul>\n<li><a href=\"https:\/\/apple.co\/3fB8Kcf\" rel=\"nofollow noopener\">App Store<\/a><\/li>\n<li><a href=\"https:\/\/bit.ly\/3m421dx\" rel=\"nofollow noopener\">Play Store<\/a><\/li>\n<li><a href=\"http:\/\/bit.ly\/367yWYD\">Wersja PWA<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>1. Just-In-Time: The Next Generation of Tailwind CSS Pojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego [&hellip;]<\/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-10166","post","type-post","status-publish","format-standard","hentry","category-frontend-pl"],"acf":{"weekly_summary":true,"estimated_reading_time":"5","feature_image_blog":false,"push_notification_image":false,"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>Frontend Thursday vol. 29 - 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-29\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Frontend Thursday vol. 29 - Vived\" \/>\n<meta property=\"og:description\" content=\"1. Just-In-Time: The Next Generation of Tailwind CSS Pojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\" \/>\n<meta property=\"og:site_name\" content=\"Vived\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-18T09:30:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-19T11:23:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.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\/frontend-thursday-vol-29\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\"},\"author\":{\"name\":\"Tomasz Borowicz\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\"},\"headline\":\"Frontend Thursday vol. 29\",\"datePublished\":\"2021-03-18T09:30:00+00:00\",\"dateModified\":\"2022-09-19T11:23:08+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\"},\"wordCount\":948,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\",\"articleSection\":[\"Frontend\"],\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\",\"url\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\",\"name\":\"Frontend Thursday vol. 29 - Vived\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\",\"datePublished\":\"2021-03-18T09:30:00+00:00\",\"dateModified\":\"2022-09-19T11:23:08+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/vived.io\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Frontend Thursday vol. 29\"}]},{\"@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. 29 - 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-29\/","og_locale":"pl_PL","og_type":"article","og_title":"Frontend Thursday vol. 29 - Vived","og_description":"1. Just-In-Time: The Next Generation of Tailwind CSS Pojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego [&hellip;]","og_url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/","og_site_name":"Vived","article_published_time":"2021-03-18T09:30:00+00:00","article_modified_time":"2022-09-19T11:23:08+00:00","og_image":[{"url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png","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-29\/#article","isPartOf":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/"},"author":{"name":"Tomasz Borowicz","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb"},"headline":"Frontend Thursday vol. 29","datePublished":"2021-03-18T09:30:00+00:00","dateModified":"2022-09-19T11:23:08+00:00","mainEntityOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/"},"wordCount":948,"commentCount":0,"publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png","articleSection":["Frontend"],"inLanguage":"pl-PL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/","url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/","name":"Frontend Thursday vol. 29 - Vived","isPartOf":{"@id":"https:\/\/vived.io\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png","datePublished":"2021-03-18T09:30:00+00:00","dateModified":"2022-09-19T11:23:08+00:00","breadcrumb":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#primaryimage","url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png"},{"@type":"BreadcrumbList","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-29\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/vived.io\/pl\/"},{"@type":"ListItem","position":2,"name":"Frontend Thursday vol. 29"}]},{"@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-just-in-time-the-next-generation-of-tailwind-css\">1. Just-In-Time: The Next Generation of Tailwind CSS<\/h1>\nPojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego w sieci zainteresowania, a w kategorii wdro\u017cenia na produkcj\u0119 zaliczy\u0142 imponuj\u0105cy wzrost z 9 na 4 miejsce. Nawet je\u015bli na pierwszy rzut oka nie przemawia do Was podej\u015bcie utility-first, to i tak dajcie mu szans\u0119 - w sieci natkn\u0105\u0142em si\u0119 przynajmniej na kilka os\u00f3b, kt\u00f3re zaczyna\u0142y z sceptycznym nastawieniem i ko\u0144czy\u0142y kompletnie zakochane.\n\nWr\u00f3\u0107my tymczasem do g\u0142\u00f3wnego tematu, czyli nowego kompilatora Tailwinda. Do tej pory w trybie deweloperskim do przegl\u0105darki dostarczany by\u0142 poka\u017any plik zawieraj\u0105cy ca\u0142ego Tailwinda (czasami maj\u0105cego nawet 10MB!). W trybie produkcyjnym natomiast standardem by\u0142o odchudzanie paczki przy pomocy PurgeCSS.Zale\u017cno\u015b\u0107 ta &nbsp;przy pomocy RegeExpa wyszukiwa\u0142a wszystkie klasy znajduj\u0105ce si\u0119 w templateach jeszcze na etapie budowania (roch\u0119 wi\u0119cej na ten temat znajdziecie w samej <a href=\"https:\/\/tailwindcss.com\/docs\/optimizing-for-production\">dokumentacji)<\/a>. Kompilator Just-In-Time zupe\u0142nie zmienia to zachowanie. Od teraz zar\u00f3wno w trybie produkcyjnym, jak i deweloperskim wraz z dodaniem kolejnej klasy do elementu, b\u0119dzie si\u0119 ona dynamicznie pojawia\u0107 w wynikowych plikach stylu. Nie wp\u0142ynie to znacz\u0105co na rozmiar bundla, ale za to mocno poprawi developer experience - w trakcie developmentu przegl\u0105darka b\u0119dzie musia\u0142a obs\u0142ugiwa\u0107 o rz\u0105d wielko\u015bci mniejszy plik CSS.\n\nNie s\u0105 to (niestety) jedyne zmiany, jakie wprowadza nowy kompilator. &nbsp;Nowy spos\u00f3b generowania klas umo\u017cliwia specyfikacj\u0119 jednostek w pikselach i kolor\u00f3w w postaci hexa.\n<pre><code class=\"language-html\">&lt;!-- Sizes and positioning --&gt;\n&lt;img class=\"absolute w-[762px] h-[918px] top-[-325px] right-[62px] md:top-[-400px] md:right-[80px]\" src=\"\/crazy-background-image.png\"&gt;\n&lt;!-- Colors --&gt;\n&lt;button class=\"bg-[#1da1f1]\"&gt;Share on Twitter&lt;\/button&gt;\n&lt;!-- Complex grids --&gt;\n&lt;div class=\"grid-cols-[1fr,700px,2fr]\"&gt;\n  &lt;!-- ... --&gt;\n&lt;\/div&gt;<\/code><\/pre>\nNa pewno jest to rozwi\u0105zanie wygodne, ale w moich oczach a\u017c nazbyt wygodne. Argument tw\u00f3rcy kompilatora, m\u00f3wi\u0105cy o synergii tego rozwi\u0105zania z Tailwindowymi breakpointami, jak najbardziej do mnie przemawia (do tej pory je\u015bli chcieli\u015bmy nada\u0107 w\u0142asny styl w zale\u017cno\u015bci od wielko\u015bci ekranu, nale\u017ca\u0142o zduplikowa\u0107 element i wykorzysta\u0107 klas\u0119 {breakpoint}:visible). Obawiam si\u0119 tylko, \u017ce bez trzymania odpowiedniej dyscypliny taka funkcjonalno\u015b\u0107 mo\u017ce doprowadzi\u0107 do zalania naszego kodu magicznymi liczbami i kolorami. Wielu programist\u00f3w na breakpointach zapewne si\u0119 nie zatrzyma\u2026 No c\u00f3\u017c, mo\u017ce moja wiara w programistyczna bra\u0107 jest zbyt ma\u0142a i taka funkcjonalno\u015b\u0107 jednak nie wp\u0142ynie negatywnie na code basy u\u017cywaj\u0105ce Tailwinda? Czas poka\u017ce...\n<figure class=\"kg-card kg-image-card\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\" alt=\"\"><\/figure>\n<h3 id=\"-r-d-a-\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css\">https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css<\/a>\n<h1 id=\"2-updates-from-the-81st-meeting-of-tc39\">2. Updates from the 81st meeting of TC39<\/h1>\nW tym tygodniu mia\u0142o r\u00f3wnie\u017c miejsce zebranie JavaScriptowej starszyzny, czyli TC39 Meeting (je\u015bli zastanawiacie si\u0119, czy por\u00f3wnywanie TC39 do india\u0144skiej starszyzny kiedykolwiek mi si\u0119 znudzi to \u015bpiesz\u0119 z wyja\u015bnieniem: nie). Je\u015bli \u015bledzicie nasze JVM-owe podsumowania, to pewnie orientujecie si\u0119, nad jakimi funkcjonalno\u015bciami trwaj\u0105 w tym \u015brodowisku prace: rekordy, pattern matching, wsp\u00f3\u0142bie\u017cno\u015b\u0107. Je\u015bli natomiast przyjrze\u0107 si\u0119, nad czym pracuje si\u0119 w \u015brodowisku JavaScriptowym, to ci\u0119\u017cko nie odnie\u015b\u0107 wra\u017cenia, \u017ce m\u00f3wimy o j\u0119zyku rozwijaj\u0105cym si\u0119 zdecydowanie mniej pr\u0119\u017cnie. Po raz kolejny najwa\u017cniejszym tematem omawianym podczas spotkania by\u0142y funkcje dotycz\u0105ce ulepszenia obs\u0142ugi czasu i daty. Zdecydowanie jest to temat istotny, no ale ile mo\u017cna\u2026\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_610d0bb85e712.gif\" alt=\"\"><figcaption>Gdyby featury omawiane na TC39 Meetings by\u0142y memem<\/figcaption><\/figure>\nSko\u0144czmy jednak narzeka\u0107 i zerknijmy na to, w jaki spos\u00f3b tym razem zaatakowano ten problem. Do etapu trzeciego prac nad specyfikacj\u0105 JavaScript trafi\u0142 obiekt Temporal. Ma on by\u0107 dost\u0119pny globalnie - podobnie jak znany wi\u0119kszo\u015bci obiekt Math. Temporal ma udost\u0119pnia\u0107 API do wygodnego operowania na datach, stawiaj\u0105c na obs\u0142ug\u0119 stref czasowych i r\u00f3\u017cnych rodzaj\u00f3w kalendarzy (pisa\u0142 kto\u015b z Was kiedy\u015b aplikacj\u0119 wspieraj\u0105c\u0105 <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Kalendarz_%C5%BCydowski\">kalendarz \u017cydowski<\/a> albo <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Era_buddyjska\">kalendarz buddyjski<\/a>?). API jest na tyle rozbudowane, \u017ce nie ma sensu dzieli\u0107 si\u0119 nim w tym blogpo\u015bcie wi\u0119c wszystkich zainteresowanych odsy\u0142am do \u017ar\u00f3d\u0142a.\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_610d0bb8c7084.png\" alt=\"\">&nbsp;\n\n<figcaption>Schemat w jaki Temporal b\u0119dzie zapisywa\u0142 daty<\/figcaption><\/figure>\n<h3 id=\"-r-d-a--1\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p\">https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p<\/a>\n<h1 id=\"3-introducing-relay-hooks-improved-react-apis-for-relay\">3. Introducing Relay Hooks: Improved React APIs for Relay<\/h1>\nNa pocz\u0105tku przyznam si\u0119, \u017ce GraphQL to jeden z tych poci\u0105g\u00f3w, kt\u00f3ry odjecha\u0142 beze mnie. Nigdy nie mia\u0142em okazji pobawi\u0107 si\u0119 tym narz\u0119dziem w bardziej zaawansowanym projekcie i moja wiedza nigdy nie wysz\u0142a poza proste tutoriale. Z racji tego bardzo ci\u0119\u017cko jest mi zar\u00f3wno por\u00f3wna\u0107 Appollo do Relay (patrz\u0105c tylko na pobrania z npm to Apollo wygrywa oko\u0142o trzykrotnie) i oceni\u0107, jak du\u017ce usprawnienia wprowadzi\u0142 Facebook w swoim kliencie (kt\u00f3ry btw wykorzystywany jest w nowej wersji webowego Facebooka, wi\u0119c bez w\u0105tpienia jest to co\u015b production ready). Je\u015bli jest z nami kto\u015b, kto ma na ten temat lepsz\u0105 wiedz\u0119, b\u0105d\u017a ciekaw\u0105 opini\u0119 to zapraszamy do komentowania na <a href=\"https:\/\/www.facebook.com\/vivedapp\">naszym Facebooku<\/a> (z odrobin\u0105 szcz\u0119\u015bcia mo\u017ce nawet zostanie zacytowani w tym blogpo\u015bcie). Ja tymczasem zostawiam Was z blogpostem opisuj\u0105cym now\u0105 wersj\u0119 Relay, bo zdecydowanie jest to du\u017ce wydarzenie dla wszystkich korzystaj\u0105cych z GraphQL.\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_610d0bba196a1.jpg\" alt=\"\">&nbsp;\n\n<figcaption>Autor frontendowego czwartku widz\u0105c newsa o nowej wersji Relay<\/figcaption><\/figure>\nPS. Wertuj\u0105c informacje o Relay i GraphQL odkopa\u0142em \u015bwietny dokument o powstawaniu GraphQL. Je\u015bli jeszcze nie widzieli\u015bcie i macie wolne p\u00f3\u0142 godziny, to gor\u0105co polecam.\n\nhttps:\/\/www.youtube.com\/watch?v=783ccP__No8\n<h3 id=\"-r-d-a--2\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/\">https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/<\/a>\n\n<hr>\n\nPami\u0119tajcie, \u017ceby spr\u00f3bowa\u0107 <a href=\"https:\/\/blog.vived.io\/software-craftsmanship-saturday\/vived.io\">Vived<\/a>, je\u015bli chcesz otrzymywa\u0107 tego typu tre\u015bci spersonalizowane pod Ciebie!\n<ul>\n \t<li><a href=\"https:\/\/apple.co\/3fB8Kcf\" rel=\"nofollow noopener\">App Store<\/a><\/li>\n \t<li><a href=\"https:\/\/bit.ly\/3m421dx\" rel=\"nofollow noopener\">Play Store<\/a><\/li>\n \t<li><a href=\"http:\/\/bit.ly\/367yWYD\">Wersja PWA<\/a><\/li>\n<\/ul>","innerContent":["<h1 id=\"1-just-in-time-the-next-generation-of-tailwind-css\">1. Just-In-Time: The Next Generation of Tailwind CSS<\/h1>\nPojawienie si\u0119 nowego kompilatora do Tailwinda by\u0142o moim zdaniem najciekawszym wydarzeniem minionego tygodnia. Je\u015bli jeszcze jakim\u015b cudem nie s\u0142yszeli\u015bcie o samym frameworku, to najwy\u017csza pora to nadrobi\u0107. W raporcie State of CSS 2020 w kategorii framework\u00f3w do stylowania Tailwind zaj\u0105\u0142 pierwsze miejsce pod wzgl\u0119dem satysfakcji i generowanego w sieci zainteresowania, a w kategorii wdro\u017cenia na produkcj\u0119 zaliczy\u0142 imponuj\u0105cy wzrost z 9 na 4 miejsce. Nawet je\u015bli na pierwszy rzut oka nie przemawia do Was podej\u015bcie utility-first, to i tak dajcie mu szans\u0119 - w sieci natkn\u0105\u0142em si\u0119 przynajmniej na kilka os\u00f3b, kt\u00f3re zaczyna\u0142y z sceptycznym nastawieniem i ko\u0144czy\u0142y kompletnie zakochane.\n\nWr\u00f3\u0107my tymczasem do g\u0142\u00f3wnego tematu, czyli nowego kompilatora Tailwinda. Do tej pory w trybie deweloperskim do przegl\u0105darki dostarczany by\u0142 poka\u017any plik zawieraj\u0105cy ca\u0142ego Tailwinda (czasami maj\u0105cego nawet 10MB!). W trybie produkcyjnym natomiast standardem by\u0142o odchudzanie paczki przy pomocy PurgeCSS.Zale\u017cno\u015b\u0107 ta &nbsp;przy pomocy RegeExpa wyszukiwa\u0142a wszystkie klasy znajduj\u0105ce si\u0119 w templateach jeszcze na etapie budowania (roch\u0119 wi\u0119cej na ten temat znajdziecie w samej <a href=\"https:\/\/tailwindcss.com\/docs\/optimizing-for-production\">dokumentacji)<\/a>. Kompilator Just-In-Time zupe\u0142nie zmienia to zachowanie. Od teraz zar\u00f3wno w trybie produkcyjnym, jak i deweloperskim wraz z dodaniem kolejnej klasy do elementu, b\u0119dzie si\u0119 ona dynamicznie pojawia\u0107 w wynikowych plikach stylu. Nie wp\u0142ynie to znacz\u0105co na rozmiar bundla, ale za to mocno poprawi developer experience - w trakcie developmentu przegl\u0105darka b\u0119dzie musia\u0142a obs\u0142ugiwa\u0107 o rz\u0105d wielko\u015bci mniejszy plik CSS.\n\nNie s\u0105 to (niestety) jedyne zmiany, jakie wprowadza nowy kompilator. &nbsp;Nowy spos\u00f3b generowania klas umo\u017cliwia specyfikacj\u0119 jednostek w pikselach i kolor\u00f3w w postaci hexa.\n<pre><code class=\"language-html\">&lt;!-- Sizes and positioning --&gt;\n&lt;img class=\"absolute w-[762px] h-[918px] top-[-325px] right-[62px] md:top-[-400px] md:right-[80px]\" src=\"\/crazy-background-image.png\"&gt;\n&lt;!-- Colors --&gt;\n&lt;button class=\"bg-[#1da1f1]\"&gt;Share on Twitter&lt;\/button&gt;\n&lt;!-- Complex grids --&gt;\n&lt;div class=\"grid-cols-[1fr,700px,2fr]\"&gt;\n  &lt;!-- ... --&gt;\n&lt;\/div&gt;<\/code><\/pre>\nNa pewno jest to rozwi\u0105zanie wygodne, ale w moich oczach a\u017c nazbyt wygodne. Argument tw\u00f3rcy kompilatora, m\u00f3wi\u0105cy o synergii tego rozwi\u0105zania z Tailwindowymi breakpointami, jak najbardziej do mnie przemawia (do tej pory je\u015bli chcieli\u015bmy nada\u0107 w\u0142asny styl w zale\u017cno\u015bci od wielko\u015bci ekranu, nale\u017ca\u0142o zduplikowa\u0107 element i wykorzysta\u0107 klas\u0119 {breakpoint}:visible). Obawiam si\u0119 tylko, \u017ce bez trzymania odpowiedniej dyscypliny taka funkcjonalno\u015b\u0107 mo\u017ce doprowadzi\u0107 do zalania naszego kodu magicznymi liczbami i kolorami. Wielu programist\u00f3w na breakpointach zapewne si\u0119 nie zatrzyma\u2026 No c\u00f3\u017c, mo\u017ce moja wiara w programistyczna bra\u0107 jest zbyt ma\u0142a i taka funkcjonalno\u015b\u0107 jednak nie wp\u0142ynie negatywnie na code basy u\u017cywaj\u0105ce Tailwinda? Czas poka\u017ce...\n<figure class=\"kg-card kg-image-card\"><img class=\"kg-image\" src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/08\/img_610d0bb60f2d4.png\" alt=\"\"><\/figure>\n<h3 id=\"-r-d-a-\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css\">https:\/\/blog.tailwindcss.com\/just-in-time-the-next-generation-of-tailwind-css<\/a>\n<h1 id=\"2-updates-from-the-81st-meeting-of-tc39\">2. Updates from the 81st meeting of TC39<\/h1>\nW tym tygodniu mia\u0142o r\u00f3wnie\u017c miejsce zebranie JavaScriptowej starszyzny, czyli TC39 Meeting (je\u015bli zastanawiacie si\u0119, czy por\u00f3wnywanie TC39 do india\u0144skiej starszyzny kiedykolwiek mi si\u0119 znudzi to \u015bpiesz\u0119 z wyja\u015bnieniem: nie). Je\u015bli \u015bledzicie nasze JVM-owe podsumowania, to pewnie orientujecie si\u0119, nad jakimi funkcjonalno\u015bciami trwaj\u0105 w tym \u015brodowisku prace: rekordy, pattern matching, wsp\u00f3\u0142bie\u017cno\u015b\u0107. Je\u015bli natomiast przyjrze\u0107 si\u0119, nad czym pracuje si\u0119 w \u015brodowisku JavaScriptowym, to ci\u0119\u017cko nie odnie\u015b\u0107 wra\u017cenia, \u017ce m\u00f3wimy o j\u0119zyku rozwijaj\u0105cym si\u0119 zdecydowanie mniej pr\u0119\u017cnie. Po raz kolejny najwa\u017cniejszym tematem omawianym podczas spotkania by\u0142y funkcje dotycz\u0105ce ulepszenia obs\u0142ugi czasu i daty. Zdecydowanie jest to temat istotny, no ale ile mo\u017cna\u2026\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_610d0bb85e712.gif\" alt=\"\"><figcaption>Gdyby featury omawiane na TC39 Meetings by\u0142y memem<\/figcaption><\/figure>\nSko\u0144czmy jednak narzeka\u0107 i zerknijmy na to, w jaki spos\u00f3b tym razem zaatakowano ten problem. Do etapu trzeciego prac nad specyfikacj\u0105 JavaScript trafi\u0142 obiekt Temporal. Ma on by\u0107 dost\u0119pny globalnie - podobnie jak znany wi\u0119kszo\u015bci obiekt Math. Temporal ma udost\u0119pnia\u0107 API do wygodnego operowania na datach, stawiaj\u0105c na obs\u0142ug\u0119 stref czasowych i r\u00f3\u017cnych rodzaj\u00f3w kalendarzy (pisa\u0142 kto\u015b z Was kiedy\u015b aplikacj\u0119 wspieraj\u0105c\u0105 <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Kalendarz_%C5%BCydowski\">kalendarz \u017cydowski<\/a> albo <a href=\"https:\/\/pl.wikipedia.org\/wiki\/Era_buddyjska\">kalendarz buddyjski<\/a>?). API jest na tyle rozbudowane, \u017ce nie ma sensu dzieli\u0107 si\u0119 nim w tym blogpo\u015bcie wi\u0119c wszystkich zainteresowanych odsy\u0142am do \u017ar\u00f3d\u0142a.\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_610d0bb8c7084.png\" alt=\"\">&nbsp;\n\n<figcaption>Schemat w jaki Temporal b\u0119dzie zapisywa\u0142 daty<\/figcaption><\/figure>\n<h3 id=\"-r-d-a--1\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p\">https:\/\/dev.to\/hemanth\/updates-from-the-81st-meeting-of-tc39-2b3p<\/a>\n<h1 id=\"3-introducing-relay-hooks-improved-react-apis-for-relay\">3. Introducing Relay Hooks: Improved React APIs for Relay<\/h1>\nNa pocz\u0105tku przyznam si\u0119, \u017ce GraphQL to jeden z tych poci\u0105g\u00f3w, kt\u00f3ry odjecha\u0142 beze mnie. Nigdy nie mia\u0142em okazji pobawi\u0107 si\u0119 tym narz\u0119dziem w bardziej zaawansowanym projekcie i moja wiedza nigdy nie wysz\u0142a poza proste tutoriale. Z racji tego bardzo ci\u0119\u017cko jest mi zar\u00f3wno por\u00f3wna\u0107 Appollo do Relay (patrz\u0105c tylko na pobrania z npm to Apollo wygrywa oko\u0142o trzykrotnie) i oceni\u0107, jak du\u017ce usprawnienia wprowadzi\u0142 Facebook w swoim kliencie (kt\u00f3ry btw wykorzystywany jest w nowej wersji webowego Facebooka, wi\u0119c bez w\u0105tpienia jest to co\u015b production ready). Je\u015bli jest z nami kto\u015b, kto ma na ten temat lepsz\u0105 wiedz\u0119, b\u0105d\u017a ciekaw\u0105 opini\u0119 to zapraszamy do komentowania na <a href=\"https:\/\/www.facebook.com\/vivedapp\">naszym Facebooku<\/a> (z odrobin\u0105 szcz\u0119\u015bcia mo\u017ce nawet zostanie zacytowani w tym blogpo\u015bcie). Ja tymczasem zostawiam Was z blogpostem opisuj\u0105cym now\u0105 wersj\u0119 Relay, bo zdecydowanie jest to du\u017ce wydarzenie dla wszystkich korzystaj\u0105cych z GraphQL.\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_610d0bba196a1.jpg\" alt=\"\">&nbsp;\n\n<figcaption>Autor frontendowego czwartku widz\u0105c newsa o nowej wersji Relay<\/figcaption><\/figure>\nPS. Wertuj\u0105c informacje o Relay i GraphQL odkopa\u0142em \u015bwietny dokument o powstawaniu GraphQL. Je\u015bli jeszcze nie widzieli\u015bcie i macie wolne p\u00f3\u0142 godziny, to gor\u0105co polecam.\n\nhttps:\/\/www.youtube.com\/watch?v=783ccP__No8\n<h3 id=\"-r-d-a--2\">\u0179r\u00f3d\u0142a:<\/h3>\n<a href=\"https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/\">https:\/\/developers.facebook.com\/blog\/post\/2021\/03\/09\/introducing-relay-hooks-improved-react-apis-relay\/<\/a>\n\n<hr>\n\nPami\u0119tajcie, \u017ceby spr\u00f3bowa\u0107 <a href=\"https:\/\/blog.vived.io\/software-craftsmanship-saturday\/vived.io\">Vived<\/a>, je\u015bli chcesz otrzymywa\u0107 tego typu tre\u015bci spersonalizowane pod Ciebie!\n<ul>\n \t<li><a href=\"https:\/\/apple.co\/3fB8Kcf\" rel=\"nofollow noopener\">App Store<\/a><\/li>\n \t<li><a href=\"https:\/\/bit.ly\/3m421dx\" rel=\"nofollow noopener\">Play Store<\/a><\/li>\n \t<li><a href=\"http:\/\/bit.ly\/367yWYD\">Wersja PWA<\/a><\/li>\n<\/ul>"]}],"_links":{"self":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10166","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=10166"}],"version-history":[{"count":1,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10166\/revisions"}],"predecessor-version":[{"id":10601,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10166\/revisions\/10601"}],"wp:attachment":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media?parent=10166"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/categories?post=10166"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/tags?post=10166"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}