{"id":10088,"date":"2021-09-02T13:02:32","date_gmt":"2021-09-02T11:02:32","guid":{"rendered":"https:\/\/vived.io\/frontend-thursday-vol-53\/"},"modified":"2022-09-19T13:16:38","modified_gmt":"2022-09-19T11:16:38","slug":"frontend-thursday-vol-53","status":"publish","type":"post","link":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/","title":{"rendered":"Frontend Thursday vol. 53"},"content":{"rendered":"\n

1. Typescript 4.4<\/h1>\n\n\n\n

Troch\u0119 ponad tydzie\u0144 temu opublikowany zosta\u0142 TypeScript 4.4, a musicie wiedzie\u0107, \u017ce pojawienie si\u0119 kolejnej wersji tego j\u0119zyka, to zawsze ma\u0142e \u015bwi\u0119to w naszym frontendowym \u015bwiecie. W ko\u0144cu jak wynika z State of JS 2020, na co dzie\u0144 z j\u0119zyka Microsoftu korzysta ponad 75% JavaScript developer\u00f3w, z czego ponad 90% jest usatysfakcjonowanych z zaistnia\u0142ej sytuacji. Uczcijmy wi\u0119c t\u0105 d\u0142ugo wyczekiwan\u0105 chwil\u0119 przegl\u0105daj\u0105c w telegraficznym skr\u00f3cie nowo\u015b<\/p>\n\n\n\n

\"\"<\/figure><\/div>\n\n\n\n

Zacznijmy od wprowadzenia type guards dzia\u0142aj\u0105cych nie tylko bezpo\u015brednio w klauzuli if, ale tak\u017ce w przy wyniesieniu warunku do osobnej zmiennej. Z usprawnienia najbardziej skorzystaj\u0105 deweloperzy agresywnie optymalizuj\u0105cy sw\u00f3j kod (do tej pory byli oni skazani albo na niewydajne wielokrotne sprawdzanie typu, albo niebezpieczne asercje typu), ale my\u015bl\u0119, \u017ce znajdzie si\u0119 te\u017c grupa problem\u00f3w, w kt\u00f3rych usprawnienie to pozwoli tworzy\u0107 po prostu czytelniejszy kod.<\/p>\n\n\n\n

function foo(arg: unknown) {\n    const argIsString = typeof arg === "string";\n    if (argIsString) {\n        console.log(arg.toUpperCase());\n        \/\/ Before TS 4.4: Error! Property 'toUpperCase' does not exist on type 'unknown'.\n    }\n}<\/code><\/pre>\n\n\n\n
Kolejna nowo\u015b\u0107 to wsparcie dla symboli i template string patterns w indexed signatures (to jedno z takich zda\u0144, kt\u00f3re sprawia, \u017ce czuj\u0119 si\u0119 jak pot\u0119\u017cny elficki mag wypowiadaj\u0105cy prastare zakl\u0119cie). Z mojej perspektywy szczeg\u00f3lnie ciekawie wygl\u0105da ta druga opcja, bo pozwala na modelowanie niedost\u0119pnych do tej pory struktur danych (np. obiekt\u00f3w posiadaj\u0105cych dowoln\u0105 liczb\u0119 data parameters).<\/p>\n\n\n\n
interface ObjectWithDataParameters {\n    [optName: `data-${string}`]: unknown;\n}\ndeclare let obj: ObjectWithDataParameters;\n\/\/ Valid to assigns\nobj["data-foo"] = true;\nobj["data-bar"] = \u201cfoo\u201d;\n\/\/ Error! 'bar' wasn't declared in\u2019ObjectWithDataParameters\u2019.\nmyDict["bar"] = "oops";\n<\/code><\/pre>\n\n\n\n
Do TypeScriptu 4.4 trafi\u0105 te\u017c dwie nowe flagi. Pierwsza z nich to `\u2013useUnknownInCatchVariables` i zmienia ona typ wy\u0142apanych w klauzuli try-catch b\u0142\u0119d\u00f3w z any na unknown. Szczerze m\u00f3wi\u0105c, a\u017c ci\u0119\u017cko mi uwierzy\u0107, \u017ce dopiero teraz doczekali\u015bmy si\u0119 takiego usprawnienia, bo typ unknow daje w tej sytuacji du\u017co wi\u0119ksze bezpiecze\u0144stwo typ\u00f3w.<\/p>\n\n\n\n
try {\n    executeSomeThirdPartyCode();\n}\ncatch (err) { \/\/ err: unknown\n    \/\/ Error! Property 'message' does not exist on type 'unknown'.\n    console.error(err.message);\n    \/\/ Works! We can narrow 'err' from 'unknown' to 'Error'.\n    if (err instanceof Error) {\n        console.error(err.message);\n    }\n}<\/code><\/pre>\n\n\n\n
Druga nowa flaga to `\u2013exactOptionalPropertyTypes` i pozwoli ona na rozr\u00f3\u017cnienie w typach sytuacji, kiedy pole mo\u017ce by\u0107 nieobecne i kiedy do pola przypisana zosta\u0142a warto\u015b\u0107 undefined. Ma to szczeg\u00f3lne znaczenie, kiedy korzystamy z spread operator i p\u0119tli for-in i po raz kolejny przyczynia si\u0119 do lepszego oddania przez typu stanu rzeczywistego obiekt\u00f3w.<\/p>\n\n\n\n
interface Dog {\n    name: string,\n    age?: number;\n}\nconst dogA: Dog = {\n    name: "Daniel",\n    age: undefined, \/\/ Error! undefined isn't a number\n};\nconst dogB: Dog = {\n    name: "Daniel",\n};\ninterface Cat {\n    name: string,\n    age: number | undefined;\n}\nconst catA: Cat = {\n    name: "Daniel",\n    age: undefined,\n};\nconst catB: Cat = {\n    name: "Daniel",\n};<\/code><\/pre>\n\n\n\n
Tw\u00f3rcy j\u0119zyka uchylili te\u017c r\u0105bka tajemnicy, je\u015bli chodzi kolejn\u0105 wersj\u0119 j\u0119zyka. W issue zamieszczonym na Githubie<\/a> znajdziemy szkic funkcjonalno\u015bci, jakie znale\u017a\u0107 maj\u0105 si\u0119 w TypeScript 4.5 oraz plan releasu tej\u017ce wersji (TLDR: wersja stabilna uka\u017ce si\u0119 16 listopada, czyli przeczytacie o niej w Frontend Thursday vol. 64). Je\u015bli chcecie zab\u0142ysn\u0105\u0107 wiedz\u0105 na najbli\u017cszej kawie, to warto zerkn\u0105\u0107, ale ja osobi\u015bcie poczekam na wersj\u0119 alfa, kt\u00f3rej zapewne tradycyjnie ju\u017c towarzyszy\u0107 b\u0119dzie \u015bwietnie opracowana notatka.<\/p>\n\n\n\n
\u0179r\u00f3d\u0142a:<\/h3>\n\n\n\n
https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-4\/<\/a>
https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418<\/a><\/p>\n\n\n\n
2. Angular 12.2<\/h1>\n\n\n\n
Angular 12.2 ukaza\u0142 si\u0119 pocz\u0105tkiem sierpnia, ale jakim\u015b cudem uciek\u0142 poza naszymi radarami. Jak na wersj\u0119 minor frameworka to znajdziemy tu ca\u0142kiem sporo usprawnie\u0144. Te kt\u00f3re moim zdaniem najbardziej zas\u0142uguj\u0105 na uwag\u0119, to nowe API dla Form Validators, wsparcie dla RxJS 7 (wreszcie koniec z .toPromise()!) i wsparcie dla underscore separator w templatach.<\/p>\n\n\n\n
{{ 1_000_000 }}\n\n\/*\nWsparcie dla underscore separator to ma\u0142a rzecz, ale za to jak cieszy\n(zwolennicy Reacta, kt\u00f3rzy tak\u0105 funkcjonalno\u015b\u0107 maj\u0105 od dawna, prawdopodobnie pukaj\u0105 si\u0119 w\u0142a\u015bnie po g\u0142owach).\n*\/<\/code><\/pre>\n\n\n\n
Prawdopodobnie nie dzieli\u0142bym si\u0119 z Wami tym newsem, gdyby nie jeszcze jedno \u201cma\u0142e\u201d usprawnienie. Ot\u00f3\u017c `ng build` otrzyma\u0142 cz\u0119\u015bciowe wsparcie dla esbuild! Dlaczego wsparcie jest tylko cz\u0119\u015bciowe? Jak twierdz\u0105 tw\u00f3rcy Angulara esbuild nie obs\u0142uguje jeszcze wszystkich niezb\u0119dnych optymalizacji, dlatego wci\u0105\u017c niezb\u0119dnym krokiem w budowaniu aplikacji jest odpalenie tersera. Zesp\u00f3\u0142 niestety nie podzieli\u0142 si\u0119 ze \u015bwiatem benchmarkami nowego rozwi\u0105zania, ale buszuj\u0105c w sieci mo\u017cna natkn\u0105\u0107 si\u0119 na deweloper\u00f3w raportuj\u0105cych czasy budowania szybsze nawet o 20-30%. Je\u015bli takie rzeczy l\u0105duj\u0105 w wersji minor, to ja ju\u017c nie mog\u0119 doczeka\u0107 si\u0119 kolejnej wersji major!<\/p>\n\n\n\n
\u0179r\u00f3d\u0142a:<\/h3>\n\n\n\n
https:\/\/www.angularminds.com\/blog\/article\/angular-v12-2.html<\/a><\/p>\n\n\n\n
3. Granie w przegl\u0105darce, czyli Chrome testuje nowe API<\/h1>\n\n\n\n
Ostatnimi czasy staramy nie dzieli\u0107 si\u0119 z Wami nowymi wersjami przegl\u0105darek, bo te rosn\u0105 jak grzyby po deszczu i zwykle nie zawieraj\u0105 nic wartego uwagi. Tym razem jest jednak troch\u0119 inaczej, bo o ile z nadchodz\u0105cych nowo\u015bci statystyczny deweloper raczej nie skorzysta, to warto zauwa\u017cy\u0107 je w kontek\u015bcie raczkuj\u0105cego trendu, jakim jest granie w przegl\u0105darkach (a mo\u017ce lepiej by\u0142oby powiedzie\u0107, jakim jest wsparcie przegl\u0105darek dla Stadi?)<\/p>\n\n\n\n
Pierwsze nowe API to WebCodecs, kt\u00f3re ma umo\u017cliwi\u0107 lepszy niskopoziomowy dost\u0119p do kodek\u00f3w wideo, co z kolei ma usprawni\u0107 procesowanie wideo szczeg\u00f3lnie na s\u0142abszych komputerach. Je\u015bli gry to nie pierwsza rzecz, jaka przychodzi Wam na my\u015bl, to nie jeste\u015bcie sami, bo t\u0105 funkcjonalno\u015bci\u0105 mocno zainteresowany jest mi\u0119dzy innymi Zoom. Je\u015bli po drodze nie wydarzy si\u0119 \u017caden kataklizm, to WebCodecs API trafi do Chrome ju\u017c w nadchodz\u0105cej wersji 94.<\/p>\n\n\n\n
\"\"
Apropo streamingu, to pami\u0119tacie jeszcze Mighty<\/a>, czyli streaming przegl\u0105darki z chmury ?<\/figcaption><\/figure>\n\n\n\n
Drugie z ciekawie wygl\u0105daj\u0105cych API to WebGPU, czyli namaszczony przez Google nast\u0119pca WebGL. W tym przypadku skojarzenia z gamingiem s\u0105 oczywiste, ale firma z Mountain View twierdzi, \u017ce technologia ta znajdzie swoje zastosowanie r\u00f3wnie\u017c przy prezentowaniu z\u0142o\u017conych modeli 3D czy w Machine Learningu. No c\u00f3\u017c, w to pierwsze mog\u0119 jeszcze uwierzy\u0107, ale co do drugiej sugestii mam spore w\u0105tpliwo\u015bci. WebGPU trafi w nasze r\u0119ce najwcze\u015bcie w Chrome 99, wi\u0119c przyjdzie nam jeszcze troch\u0119 poczeka\u0107.<\/p>\n\n\n\n
\"\"
Czy na sali jest kto\u015b kto wierzy, \u017ce JavaScript mo\u017ce sta\u0107 si\u0119 przysz\u0142o\u015bci\u0105 sztucznej inteligencji i data science?<\/figcaption><\/figure><\/div>\n\n\n\n
\u0179r\u00f3d\u0142a:<\/h3>\n\n\n\n
https:\/\/www.theverge.com\/2021\/8\/30\/22649214\/chrome-94-beta-browser-gaming-apis-metal-directx-vulkan-streaming-graphics-codecs<\/a>
https:\/\/blog.chromium.org\/2021\/08\/chrome-94-beta-webcodecs-webgpu.html<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
W dzisiejszej edycji mamy dla Was nowego TypeScripta, nowego Angulara i troch\u0119 o przysz\u0142o\u015bci grania w chmurze.<\/p>\n","protected":false},"author":12,"featured_media":7671,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[273],"tags":[],"class_list":["post-10088","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-frontend-pl"],"acf":{"estimated_reading_time":"5","weekly_summary":true},"yoast_head":"\nFrontend Thursday vol. 53 - 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-53\/\" \/>\n<meta property=\"og:locale\" content=\"pl_PL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Frontend Thursday vol. 53 - Vived\" \/>\n<meta property=\"og:description\" content=\"W dzisiejszej edycji mamy dla Was nowego TypeScripta, nowego Angulara i troch\u0119 o przysz\u0142o\u015bci grania w chmurze.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\" \/>\n<meta property=\"og:site_name\" content=\"Vived\" \/>\n<meta property=\"article:published_time\" content=\"2021-09-02T11:02:32+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-19T11:16:38+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png\" \/>\n\t<meta property=\"og:image:width\" content=\"3360\" \/>\n\t<meta property=\"og:image:height\" content=\"1752\" \/>\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\/frontend-thursday-vol-53\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\"},\"author\":{\"name\":\"Tomasz Borowicz\",\"@id\":\"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb\"},\"headline\":\"Frontend Thursday vol. 53\",\"datePublished\":\"2021-09-02T11:02:32+00:00\",\"dateModified\":\"2022-09-19T11:16:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\"},\"wordCount\":908,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/vived.io\/pl\/#organization\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png\",\"articleSection\":[\"Frontend\"],\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\",\"url\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\",\"name\":\"Frontend Thursday vol. 53 - Vived\",\"isPartOf\":{\"@id\":\"https:\/\/vived.io\/pl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png\",\"datePublished\":\"2021-09-02T11:02:32+00:00\",\"dateModified\":\"2022-09-19T11:16:38+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#breadcrumb\"},\"inLanguage\":\"pl-PL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pl-PL\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage\",\"url\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png\",\"contentUrl\":\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png\",\"width\":3360,\"height\":1752},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Strona g\u0142\u00f3wna\",\"item\":\"https:\/\/vived.io\/pl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Frontend Thursday vol. 53\"}]},{\"@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. 53 - 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-53\/","og_locale":"pl_PL","og_type":"article","og_title":"Frontend Thursday vol. 53 - Vived","og_description":"W dzisiejszej edycji mamy dla Was nowego TypeScripta, nowego Angulara i troch\u0119 o przysz\u0142o\u015bci grania w chmurze.","og_url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/","og_site_name":"Vived","article_published_time":"2021-09-02T11:02:32+00:00","article_modified_time":"2022-09-19T11:16:38+00:00","og_image":[{"width":3360,"height":1752,"url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.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\/frontend-thursday-vol-53\/#article","isPartOf":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/"},"author":{"name":"Tomasz Borowicz","@id":"https:\/\/vived.io\/pl\/#\/schema\/person\/9d2a72fe7d0dfbb4092675afbab742bb"},"headline":"Frontend Thursday vol. 53","datePublished":"2021-09-02T11:02:32+00:00","dateModified":"2022-09-19T11:16:38+00:00","mainEntityOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/"},"wordCount":908,"commentCount":0,"publisher":{"@id":"https:\/\/vived.io\/pl\/#organization"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png","articleSection":["Frontend"],"inLanguage":"pl-PL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/","url":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/","name":"Frontend Thursday vol. 53 - Vived","isPartOf":{"@id":"https:\/\/vived.io\/pl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage"},"image":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage"},"thumbnailUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png","datePublished":"2021-09-02T11:02:32+00:00","dateModified":"2022-09-19T11:16:38+00:00","breadcrumb":{"@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#breadcrumb"},"inLanguage":"pl-PL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/"]}]},{"@type":"ImageObject","inLanguage":"pl-PL","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#primaryimage","url":"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png","contentUrl":"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-12.06.10.png","width":3360,"height":1752},{"@type":"BreadcrumbList","@id":"https:\/\/vived.io\/pl\/frontend-thursday-vol-53\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Strona g\u0142\u00f3wna","item":"https:\/\/vived.io\/pl\/"},{"@type":"ListItem","position":2,"name":"Frontend Thursday vol. 53"}]},{"@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":{"level":1},"innerBlocks":[],"innerHTML":"\n<h1 id=\"1-yarn-30\">1.  Typescript 4.4<\/h1>\n","innerContent":["\n<h1 id=\"1-yarn-30\">1.  Typescript 4.4<\/h1>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Troch\u0119 ponad tydzie\u0144 temu opublikowany zosta\u0142 TypeScript 4.4, a musicie wiedzie\u0107, \u017ce pojawienie si\u0119 kolejnej wersji tego j\u0119zyka, to zawsze ma\u0142e \u015bwi\u0119to w naszym frontendowym \u015bwiecie. W ko\u0144cu jak wynika z State of JS 2020, na co dzie\u0144 z j\u0119zyka Microsoftu korzysta ponad 75% JavaScript developer\u00f3w, z czego ponad 90% jest usatysfakcjonowanych z zaistnia\u0142ej sytuacji. Uczcijmy wi\u0119c t\u0105 d\u0142ugo wyczekiwan\u0105 chwil\u0119 przegl\u0105daj\u0105c w telegraficznym skr\u00f3cie nowo\u015b<\/p>\n","innerContent":["\n<p>Troch\u0119 ponad tydzie\u0144 temu opublikowany zosta\u0142 TypeScript 4.4, a musicie wiedzie\u0107, \u017ce pojawienie si\u0119 kolejnej wersji tego j\u0119zyka, to zawsze ma\u0142e \u015bwi\u0119to w naszym frontendowym \u015bwiecie. W ko\u0144cu jak wynika z State of JS 2020, na co dzie\u0144 z j\u0119zyka Microsoftu korzysta ponad 75% JavaScript developer\u00f3w, z czego ponad 90% jest usatysfakcjonowanych z zaistnia\u0142ej sytuacji. Uczcijmy wi\u0119c t\u0105 d\u0142ugo wyczekiwan\u0105 chwil\u0119 przegl\u0105daj\u0105c w telegraficznym skr\u00f3cie nowo\u015b<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":2123,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/ts-meme.jpeg\" alt=\"\" class=\"wp-image-2123\"\/><\/figure><\/div>\n","innerContent":["\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/ts-meme.jpeg\" alt=\"\" class=\"wp-image-2123\"\/><\/figure><\/div>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Zacznijmy od wprowadzenia type guards dzia\u0142aj\u0105cych nie tylko bezpo\u015brednio w klauzuli if, ale tak\u017ce w przy wyniesieniu warunku do osobnej zmiennej. Z usprawnienia najbardziej skorzystaj\u0105 deweloperzy agresywnie optymalizuj\u0105cy sw\u00f3j kod (do tej pory byli oni skazani albo na niewydajne wielokrotne sprawdzanie typu, albo niebezpieczne asercje typu), ale my\u015bl\u0119, \u017ce znajdzie si\u0119 te\u017c grupa problem\u00f3w, w kt\u00f3rych usprawnienie to pozwoli tworzy\u0107 po prostu czytelniejszy kod.<\/p>\n","innerContent":["\n<p>Zacznijmy od wprowadzenia type guards dzia\u0142aj\u0105cych nie tylko bezpo\u015brednio w klauzuli if, ale tak\u017ce w przy wyniesieniu warunku do osobnej zmiennej. Z usprawnienia najbardziej skorzystaj\u0105 deweloperzy agresywnie optymalizuj\u0105cy sw\u00f3j kod (do tej pory byli oni skazani albo na niewydajne wielokrotne sprawdzanie typu, albo niebezpieczne asercje typu), ale my\u015bl\u0119, \u017ce znajdzie si\u0119 te\u017c grupa problem\u00f3w, w kt\u00f3rych usprawnienie to pozwoli tworzy\u0107 po prostu czytelniejszy kod.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/code","attrs":[],"innerBlocks":[],"innerHTML":"\n<pre class=\"wp-block-code\"><code>function foo(arg: unknown) {\n    const argIsString = typeof arg === \"string\";\n    if (argIsString) {\n        console.log(arg.toUpperCase());\n        \/\/ Before TS 4.4: Error! Property 'toUpperCase' does not exist on type 'unknown'.\n    }\n}<\/code><\/pre>\n","innerContent":["\n<pre class=\"wp-block-code\"><code>function foo(arg: unknown) {\n    const argIsString = typeof arg === \"string\";\n    if (argIsString) {\n        console.log(arg.toUpperCase());\n        \/\/ Before TS 4.4: Error! Property 'toUpperCase' does not exist on type 'unknown'.\n    }\n}<\/code><\/pre>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Kolejna nowo\u015b\u0107 to wsparcie dla symboli i template string patterns w indexed signatures (to jedno z takich zda\u0144, kt\u00f3re sprawia, \u017ce czuj\u0119 si\u0119 jak pot\u0119\u017cny elficki mag wypowiadaj\u0105cy prastare zakl\u0119cie). Z mojej perspektywy szczeg\u00f3lnie ciekawie wygl\u0105da ta druga opcja, bo pozwala na modelowanie niedost\u0119pnych do tej pory struktur danych (np. obiekt\u00f3w posiadaj\u0105cych dowoln\u0105 liczb\u0119 data parameters).<\/p>\n","innerContent":["\n<p>Kolejna nowo\u015b\u0107 to wsparcie dla symboli i template string patterns w indexed signatures (to jedno z takich zda\u0144, kt\u00f3re sprawia, \u017ce czuj\u0119 si\u0119 jak pot\u0119\u017cny elficki mag wypowiadaj\u0105cy prastare zakl\u0119cie). Z mojej perspektywy szczeg\u00f3lnie ciekawie wygl\u0105da ta druga opcja, bo pozwala na modelowanie niedost\u0119pnych do tej pory struktur danych (np. obiekt\u00f3w posiadaj\u0105cych dowoln\u0105 liczb\u0119 data parameters).<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/code","attrs":[],"innerBlocks":[],"innerHTML":"\n<pre class=\"wp-block-code\"><code>interface ObjectWithDataParameters {\n    [optName: `data-${string}`]: unknown;\n}\ndeclare let obj: ObjectWithDataParameters;\n\/\/ Valid to assigns\nobj[\"data-foo\"] = true;\nobj[\"data-bar\"] = \u201cfoo\u201d;\n\/\/ Error! 'bar' wasn't declared in\u2019ObjectWithDataParameters\u2019.\nmyDict[\"bar\"] = \"oops\";\n<\/code><\/pre>\n","innerContent":["\n<pre class=\"wp-block-code\"><code>interface ObjectWithDataParameters {\n    [optName: `data-${string}`]: unknown;\n}\ndeclare let obj: ObjectWithDataParameters;\n\/\/ Valid to assigns\nobj[\"data-foo\"] = true;\nobj[\"data-bar\"] = \u201cfoo\u201d;\n\/\/ Error! 'bar' wasn't declared in\u2019ObjectWithDataParameters\u2019.\nmyDict[\"bar\"] = \"oops\";\n<\/code><\/pre>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Do TypeScriptu 4.4 trafi\u0105 te\u017c dwie nowe flagi. Pierwsza z nich to `\u2013useUnknownInCatchVariables` i zmienia ona typ wy\u0142apanych w klauzuli try-catch b\u0142\u0119d\u00f3w z any na unknown. Szczerze m\u00f3wi\u0105c, a\u017c ci\u0119\u017cko mi uwierzy\u0107, \u017ce dopiero teraz doczekali\u015bmy si\u0119 takiego usprawnienia, bo typ unknow daje w tej sytuacji du\u017co wi\u0119ksze bezpiecze\u0144stwo typ\u00f3w.<\/p>\n","innerContent":["\n<p>Do TypeScriptu 4.4 trafi\u0105 te\u017c dwie nowe flagi. Pierwsza z nich to `\u2013useUnknownInCatchVariables` i zmienia ona typ wy\u0142apanych w klauzuli try-catch b\u0142\u0119d\u00f3w z any na unknown. Szczerze m\u00f3wi\u0105c, a\u017c ci\u0119\u017cko mi uwierzy\u0107, \u017ce dopiero teraz doczekali\u015bmy si\u0119 takiego usprawnienia, bo typ unknow daje w tej sytuacji du\u017co wi\u0119ksze bezpiecze\u0144stwo typ\u00f3w.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/code","attrs":[],"innerBlocks":[],"innerHTML":"\n<pre class=\"wp-block-code\"><code>try {\n    executeSomeThirdPartyCode();\n}\ncatch (err) { \/\/ err: unknown\n    \/\/ Error! Property 'message' does not exist on type 'unknown'.\n    console.error(err.message);\n    \/\/ Works! We can narrow 'err' from 'unknown' to 'Error'.\n    if (err instanceof Error) {\n        console.error(err.message);\n    }\n}<\/code><\/pre>\n","innerContent":["\n<pre class=\"wp-block-code\"><code>try {\n    executeSomeThirdPartyCode();\n}\ncatch (err) { \/\/ err: unknown\n    \/\/ Error! Property 'message' does not exist on type 'unknown'.\n    console.error(err.message);\n    \/\/ Works! We can narrow 'err' from 'unknown' to 'Error'.\n    if (err instanceof Error) {\n        console.error(err.message);\n    }\n}<\/code><\/pre>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Druga nowa flaga to `\u2013exactOptionalPropertyTypes` i pozwoli ona na rozr\u00f3\u017cnienie w typach sytuacji, kiedy pole mo\u017ce by\u0107 nieobecne i kiedy do pola przypisana zosta\u0142a warto\u015b\u0107 undefined. Ma to szczeg\u00f3lne znaczenie, kiedy korzystamy z spread operator i p\u0119tli for-in i po raz kolejny przyczynia si\u0119 do lepszego oddania przez typu stanu rzeczywistego obiekt\u00f3w.<\/p>\n","innerContent":["\n<p>Druga nowa flaga to `\u2013exactOptionalPropertyTypes` i pozwoli ona na rozr\u00f3\u017cnienie w typach sytuacji, kiedy pole mo\u017ce by\u0107 nieobecne i kiedy do pola przypisana zosta\u0142a warto\u015b\u0107 undefined. Ma to szczeg\u00f3lne znaczenie, kiedy korzystamy z spread operator i p\u0119tli for-in i po raz kolejny przyczynia si\u0119 do lepszego oddania przez typu stanu rzeczywistego obiekt\u00f3w.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/code","attrs":[],"innerBlocks":[],"innerHTML":"\n<pre class=\"wp-block-code\"><code>interface Dog {\n    name: string,\n    age?: number;\n}\nconst dogA: Dog = {\n    name: \"Daniel\",\n    age: undefined, \/\/ Error! undefined isn't a number\n};\nconst dogB: Dog = {\n    name: \"Daniel\",\n};\ninterface Cat {\n    name: string,\n    age: number | undefined;\n}\nconst catA: Cat = {\n    name: \"Daniel\",\n    age: undefined,\n};\nconst catB: Cat = {\n    name: \"Daniel\",\n};<\/code><\/pre>\n","innerContent":["\n<pre class=\"wp-block-code\"><code>interface Dog {\n    name: string,\n    age?: number;\n}\nconst dogA: Dog = {\n    name: \"Daniel\",\n    age: undefined, \/\/ Error! undefined isn't a number\n};\nconst dogB: Dog = {\n    name: \"Daniel\",\n};\ninterface Cat {\n    name: string,\n    age: number | undefined;\n}\nconst catA: Cat = {\n    name: \"Daniel\",\n    age: undefined,\n};\nconst catB: Cat = {\n    name: \"Daniel\",\n};<\/code><\/pre>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Tw\u00f3rcy j\u0119zyka uchylili te\u017c r\u0105bka tajemnicy, je\u015bli chodzi kolejn\u0105 wersj\u0119 j\u0119zyka. W <a href=\"https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418\">issue zamieszczonym na Githubie<\/a> znajdziemy szkic funkcjonalno\u015bci, jakie znale\u017a\u0107 maj\u0105 si\u0119 w TypeScript 4.5 oraz plan releasu tej\u017ce wersji (TLDR: wersja stabilna uka\u017ce si\u0119 16 listopada, czyli przeczytacie o niej w Frontend Thursday vol. 64). Je\u015bli chcecie zab\u0142ysn\u0105\u0107 wiedz\u0105 na najbli\u017cszej kawie, to warto zerkn\u0105\u0107, ale ja osobi\u015bcie poczekam na wersj\u0119 alfa, kt\u00f3rej zapewne tradycyjnie ju\u017c towarzyszy\u0107 b\u0119dzie \u015bwietnie opracowana notatka.<\/p>\n","innerContent":["\n<p>Tw\u00f3rcy j\u0119zyka uchylili te\u017c r\u0105bka tajemnicy, je\u015bli chodzi kolejn\u0105 wersj\u0119 j\u0119zyka. W <a href=\"https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418\">issue zamieszczonym na Githubie<\/a> znajdziemy szkic funkcjonalno\u015bci, jakie znale\u017a\u0107 maj\u0105 si\u0119 w TypeScript 4.5 oraz plan releasu tej\u017ce wersji (TLDR: wersja stabilna uka\u017ce si\u0119 16 listopada, czyli przeczytacie o niej w Frontend Thursday vol. 64). Je\u015bli chcecie zab\u0142ysn\u0105\u0107 wiedz\u0105 na najbli\u017cszej kawie, to warto zerkn\u0105\u0107, ale ja osobi\u015bcie poczekam na wersj\u0119 alfa, kt\u00f3rej zapewne tradycyjnie ju\u017c towarzyszy\u0107 b\u0119dzie \u015bwietnie opracowana notatka.<\/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><meta charset=\"utf-8\"><a href=\"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-4\/\">https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-4\/<\/a><br><a href=\"https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418\">https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418<\/a><\/p>\n","innerContent":["\n<p><meta charset=\"utf-8\"><a href=\"https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-4\/\">https:\/\/devblogs.microsoft.com\/typescript\/announcing-typescript-4-4\/<\/a><br><a href=\"https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418\">https:\/\/github.com\/microsoft\/TypeScript\/issues\/45418<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":1},"innerBlocks":[],"innerHTML":"\n<h1>2. Angular 12.2<\/h1>\n","innerContent":["\n<h1>2. Angular 12.2<\/h1>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Angular 12.2 ukaza\u0142 si\u0119 pocz\u0105tkiem sierpnia, ale jakim\u015b cudem uciek\u0142 poza naszymi radarami. Jak na wersj\u0119 minor frameworka to znajdziemy tu ca\u0142kiem sporo usprawnie\u0144. Te kt\u00f3re moim zdaniem najbardziej zas\u0142uguj\u0105 na uwag\u0119, to nowe API dla Form Validators, wsparcie dla RxJS 7 (wreszcie koniec z .toPromise()!) i wsparcie dla underscore separator w templatach.<\/p>\n","innerContent":["\n<p>Angular 12.2 ukaza\u0142 si\u0119 pocz\u0105tkiem sierpnia, ale jakim\u015b cudem uciek\u0142 poza naszymi radarami. Jak na wersj\u0119 minor frameworka to znajdziemy tu ca\u0142kiem sporo usprawnie\u0144. Te kt\u00f3re moim zdaniem najbardziej zas\u0142uguj\u0105 na uwag\u0119, to nowe API dla Form Validators, wsparcie dla RxJS 7 (wreszcie koniec z .toPromise()!) i wsparcie dla underscore separator w templatach.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/code","attrs":[],"innerBlocks":[],"innerHTML":"\n<pre class=\"wp-block-code\"><code>{{ 1_000_000 }}\n\n\/*\nWsparcie dla underscore separator to ma\u0142a rzecz, ale za to jak cieszy\n(zwolennicy Reacta, kt\u00f3rzy tak\u0105 funkcjonalno\u015b\u0107 maj\u0105 od dawna, prawdopodobnie pukaj\u0105 si\u0119 w\u0142a\u015bnie po g\u0142owach).\n*\/<\/code><\/pre>\n","innerContent":["\n<pre class=\"wp-block-code\"><code>{{ 1_000_000 }}\n\n\/*\nWsparcie dla underscore separator to ma\u0142a rzecz, ale za to jak cieszy\n(zwolennicy Reacta, kt\u00f3rzy tak\u0105 funkcjonalno\u015b\u0107 maj\u0105 od dawna, prawdopodobnie pukaj\u0105 si\u0119 w\u0142a\u015bnie po g\u0142owach).\n*\/<\/code><\/pre>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Prawdopodobnie nie dzieli\u0142bym si\u0119 z Wami tym newsem, gdyby nie jeszcze jedno \u201cma\u0142e\u201d usprawnienie. Ot\u00f3\u017c `ng build` otrzyma\u0142 cz\u0119\u015bciowe wsparcie dla esbuild! Dlaczego wsparcie jest tylko cz\u0119\u015bciowe? Jak twierdz\u0105 tw\u00f3rcy Angulara esbuild nie obs\u0142uguje jeszcze wszystkich niezb\u0119dnych optymalizacji, dlatego wci\u0105\u017c niezb\u0119dnym krokiem w budowaniu aplikacji jest odpalenie tersera. Zesp\u00f3\u0142 niestety nie podzieli\u0142 si\u0119 ze \u015bwiatem benchmarkami nowego rozwi\u0105zania, ale buszuj\u0105c w sieci mo\u017cna natkn\u0105\u0107 si\u0119 na deweloper\u00f3w raportuj\u0105cych czasy budowania szybsze nawet o 20-30%. Je\u015bli takie rzeczy l\u0105duj\u0105 w wersji minor, to ja ju\u017c nie mog\u0119 doczeka\u0107 si\u0119 kolejnej wersji major!<\/p>\n","innerContent":["\n<p>Prawdopodobnie nie dzieli\u0142bym si\u0119 z Wami tym newsem, gdyby nie jeszcze jedno \u201cma\u0142e\u201d usprawnienie. Ot\u00f3\u017c `ng build` otrzyma\u0142 cz\u0119\u015bciowe wsparcie dla esbuild! Dlaczego wsparcie jest tylko cz\u0119\u015bciowe? Jak twierdz\u0105 tw\u00f3rcy Angulara esbuild nie obs\u0142uguje jeszcze wszystkich niezb\u0119dnych optymalizacji, dlatego wci\u0105\u017c niezb\u0119dnym krokiem w budowaniu aplikacji jest odpalenie tersera. Zesp\u00f3\u0142 niestety nie podzieli\u0142 si\u0119 ze \u015bwiatem benchmarkami nowego rozwi\u0105zania, ale buszuj\u0105c w sieci mo\u017cna natkn\u0105\u0107 si\u0119 na deweloper\u00f3w raportuj\u0105cych czasy budowania szybsze nawet o 20-30%. Je\u015bli takie rzeczy l\u0105duj\u0105 w wersji minor, to ja ju\u017c nie mog\u0119 doczeka\u0107 si\u0119 kolejnej wersji major!<\/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:\/\/www.angularminds.com\/blog\/article\/angular-v12-2.html\">https:\/\/www.angularminds.com\/blog\/article\/angular-v12-2.html<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/www.angularminds.com\/blog\/article\/angular-v12-2.html\">https:\/\/www.angularminds.com\/blog\/article\/angular-v12-2.html<\/a><\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/heading","attrs":{"level":1},"innerBlocks":[],"innerHTML":"\n<h1>3. Granie w przegl\u0105darce, czyli Chrome testuje nowe API<\/h1>\n","innerContent":["\n<h1>3. Granie w przegl\u0105darce, czyli Chrome testuje nowe API<\/h1>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Ostatnimi czasy staramy nie dzieli\u0107 si\u0119 z Wami nowymi wersjami przegl\u0105darek, bo te rosn\u0105 jak grzyby po deszczu i zwykle nie zawieraj\u0105 nic wartego uwagi. Tym razem jest jednak troch\u0119 inaczej, bo o ile z nadchodz\u0105cych nowo\u015bci statystyczny deweloper raczej nie skorzysta, to warto zauwa\u017cy\u0107 je w kontek\u015bcie raczkuj\u0105cego trendu, jakim jest granie w przegl\u0105darkach (a mo\u017ce lepiej by\u0142oby powiedzie\u0107, jakim jest wsparcie przegl\u0105darek dla Stadi?)<\/p>\n","innerContent":["\n<p>Ostatnimi czasy staramy nie dzieli\u0107 si\u0119 z Wami nowymi wersjami przegl\u0105darek, bo te rosn\u0105 jak grzyby po deszczu i zwykle nie zawieraj\u0105 nic wartego uwagi. Tym razem jest jednak troch\u0119 inaczej, bo o ile z nadchodz\u0105cych nowo\u015bci statystyczny deweloper raczej nie skorzysta, to warto zauwa\u017cy\u0107 je w kontek\u015bcie raczkuj\u0105cego trendu, jakim jest granie w przegl\u0105darkach (a mo\u017ce lepiej by\u0142oby powiedzie\u0107, jakim jest wsparcie przegl\u0105darek dla Stadi?)<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Pierwsze nowe API to WebCodecs, kt\u00f3re ma umo\u017cliwi\u0107 lepszy niskopoziomowy dost\u0119p do kodek\u00f3w wideo, co z kolei ma usprawni\u0107 procesowanie wideo szczeg\u00f3lnie na s\u0142abszych komputerach. Je\u015bli gry to nie pierwsza rzecz, jaka przychodzi Wam na my\u015bl, to nie jeste\u015bcie sami, bo t\u0105 funkcjonalno\u015bci\u0105 mocno zainteresowany jest mi\u0119dzy innymi Zoom. Je\u015bli po drodze nie wydarzy si\u0119 \u017caden kataklizm, to WebCodecs API trafi do Chrome ju\u017c w nadchodz\u0105cej wersji 94.<\/p>\n","innerContent":["\n<p>Pierwsze nowe API to WebCodecs, kt\u00f3re ma umo\u017cliwi\u0107 lepszy niskopoziomowy dost\u0119p do kodek\u00f3w wideo, co z kolei ma usprawni\u0107 procesowanie wideo szczeg\u00f3lnie na s\u0142abszych komputerach. Je\u015bli gry to nie pierwsza rzecz, jaka przychodzi Wam na my\u015bl, to nie jeste\u015bcie sami, bo t\u0105 funkcjonalno\u015bci\u0105 mocno zainteresowany jest mi\u0119dzy innymi Zoom. Je\u015bli po drodze nie wydarzy si\u0119 \u017caden kataklizm, to WebCodecs API trafi do Chrome ju\u017c w nadchodz\u0105cej wersji 94.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"id":2124,"sizeSlug":"large","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-11.41.27-1024x498.png\" alt=\"\" class=\"wp-image-2124\"\/><figcaption>Apropo streamingu, to pami\u0119tacie jeszcze <a href=\"https:\/\/www.mightyapp.com\/\">Mighty<\/a>, czyli streaming przegl\u0105darki z chmury ?<\/figcaption><\/figure>\n","innerContent":["\n<figure class=\"wp-block-image size-large\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/09\/Screenshot-2021-09-02-at-11.41.27-1024x498.png\" alt=\"\" class=\"wp-image-2124\"\/><figcaption>Apropo streamingu, to pami\u0119tacie jeszcze <a href=\"https:\/\/www.mightyapp.com\/\">Mighty<\/a>, czyli streaming przegl\u0105darki z chmury ?<\/figcaption><\/figure>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/paragraph","attrs":[],"innerBlocks":[],"innerHTML":"\n<p>Drugie z ciekawie wygl\u0105daj\u0105cych API to WebGPU, czyli namaszczony przez Google nast\u0119pca WebGL. W tym przypadku skojarzenia z gamingiem s\u0105 oczywiste, ale firma z Mountain View twierdzi, \u017ce technologia ta znajdzie swoje zastosowanie r\u00f3wnie\u017c przy prezentowaniu z\u0142o\u017conych modeli 3D czy w Machine Learningu. No c\u00f3\u017c, w to pierwsze mog\u0119 jeszcze uwierzy\u0107, ale co do drugiej sugestii mam spore w\u0105tpliwo\u015bci. WebGPU trafi w nasze r\u0119ce najwcze\u015bcie w Chrome 99, wi\u0119c przyjdzie nam jeszcze troch\u0119 poczeka\u0107.<\/p>\n","innerContent":["\n<p>Drugie z ciekawie wygl\u0105daj\u0105cych API to WebGPU, czyli namaszczony przez Google nast\u0119pca WebGL. W tym przypadku skojarzenia z gamingiem s\u0105 oczywiste, ale firma z Mountain View twierdzi, \u017ce technologia ta znajdzie swoje zastosowanie r\u00f3wnie\u017c przy prezentowaniu z\u0142o\u017conych modeli 3D czy w Machine Learningu. No c\u00f3\u017c, w to pierwsze mog\u0119 jeszcze uwierzy\u0107, ale co do drugiej sugestii mam spore w\u0105tpliwo\u015bci. WebGPU trafi w nasze r\u0119ce najwcze\u015bcie w Chrome 99, wi\u0119c przyjdzie nam jeszcze troch\u0119 poczeka\u0107.<\/p>\n"]},{"blockName":null,"attrs":[],"innerBlocks":[],"innerHTML":"\n\n","innerContent":["\n\n"]},{"blockName":"core\/image","attrs":{"align":"center","id":2121,"sizeSlug":"full","linkDestination":"none"},"innerBlocks":[],"innerHTML":"\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/07\/empty-room-will-smith-2.gif\" alt=\"\" class=\"wp-image-2121\"\/><figcaption>Czy na sali jest kto\u015b kto wierzy, \u017ce JavaScript mo\u017ce sta\u0107 si\u0119 przysz\u0142o\u015bci\u0105 sztucznej inteligencji i data science?<\/figcaption><\/figure><\/div>\n","innerContent":["\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><img src=\"https:\/\/vived.io\/wp-content\/uploads\/2021\/07\/empty-room-will-smith-2.gif\" alt=\"\" class=\"wp-image-2121\"\/><figcaption>Czy na sali jest kto\u015b kto wierzy, \u017ce JavaScript mo\u017ce sta\u0107 si\u0119 przysz\u0142o\u015bci\u0105 sztucznej inteligencji i data science?<\/figcaption><\/figure><\/div>\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:\/\/www.theverge.com\/2021\/8\/30\/22649214\/chrome-94-beta-browser-gaming-apis-metal-directx-vulkan-streaming-graphics-codecs\">https:\/\/www.theverge.com\/2021\/8\/30\/22649214\/chrome-94-beta-browser-gaming-apis-metal-directx-vulkan-streaming-graphics-codecs<\/a><br><a href=\"https:\/\/blog.chromium.org\/2021\/08\/chrome-94-beta-webcodecs-webgpu.html\">https:\/\/blog.chromium.org\/2021\/08\/chrome-94-beta-webcodecs-webgpu.html<\/a><\/p>\n","innerContent":["\n<p><a href=\"https:\/\/www.theverge.com\/2021\/8\/30\/22649214\/chrome-94-beta-browser-gaming-apis-metal-directx-vulkan-streaming-graphics-codecs\">https:\/\/www.theverge.com\/2021\/8\/30\/22649214\/chrome-94-beta-browser-gaming-apis-metal-directx-vulkan-streaming-graphics-codecs<\/a><br><a href=\"https:\/\/blog.chromium.org\/2021\/08\/chrome-94-beta-webcodecs-webgpu.html\">https:\/\/blog.chromium.org\/2021\/08\/chrome-94-beta-webcodecs-webgpu.html<\/a><\/p>\n"]}],"_links":{"self":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10088","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=10088"}],"version-history":[{"count":1,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10088\/revisions"}],"predecessor-version":[{"id":10624,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/posts\/10088\/revisions\/10624"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media\/7671"}],"wp:attachment":[{"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/media?parent=10088"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/categories?post=10088"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vived.io\/pl\/wp-json\/wp\/v2\/tags?post=10088"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}