Comiesięczna aktualizacja tworzenia stron internetowych 6⁄2018: złożoność, DNS przez HTTPS i powiadomienia push

W dzisiejszych czasach widzimy złożoność w każdym zakątku projektu internetowego. Przeczytaliśmy sporo artykułów o tym, jak złożona stała się określona technologia, i wciąż o tym dyskutujemy. Pochodząc z czasów, w których przesyłaliśmy strony przez FTP i nie mieliśmy git ani niczego porównywalnego, teraz żyjemy w czasach, w których mamy system budowania, transpilery, frameworki, testy i CI nawet dla najmniejszych projektów, jest to łatwe do zrozumienia . Ale z drugiej strony, tworzenie stron internetowych rozwinęło się tak bardzo w ciągu ostatnich 15 lat, że nie możemy już tak naprawdę porównywać dzisiejszego dnia z przeszłością . I choć mogłoby się wydawać, że w przeszłości niektóre rzeczy były łatwiejsze, zaniedbujemy zalety i niezliczone możliwości, które mamy dzisiaj. Kiedy wtedy nie pisaliśmy testów, cóż, po prostu nie mieliśmy testów — co oznacza brak niezawodnego sposobu testowania pod kątem sukcesu. Gdy nie mieliśmy procesu wdrażania, łatwo było przesłać nową wersję, ale równie łatwo było coś zepsuć — i stało się to o wiele więcej niż dzisiaj, gdy istnieje system ciągłej integracji.

Jeffrey Zeldman napisał na ten temat ciekawy artykuł: „The Cult of Complex” opisuje, jak zatracamy się w niepotrzebnych szczegółach i często staramy się przemyśleć problemy . Podoba mi się wyzwanie polegające na budowaniu systemów, które nie są zbyt skomplikowane, ale wykazują przyzwoitą odpowiedzialność (jeśli chodzi o etykę, prywatność, bezpieczeństwo, doskonałe wrażenia użytkownika i wydajność) i działają niezawodnie (testy, wdrożenia, dostępność i wydajność ponownie). Myślę, że problem ze znalezieniem odpowiedniej równowagi nie zniknie w najbliższym czasie. Złożoność jest wszędzie — musimy tylko zdecydować, czy jest to użyteczna złożoność, czy została dodana tylko dlatego, że była łatwiejsza, czy też dlatego, że przepracowaliśmy pierwotny problem.

Aktualności

• Nadchodząca wersja Safari 12 została zaprezentowana na WWDC firmy Apple. Oto nowości: ikony na kartach, silne hasła, a także sterowanie generatorem haseł za pomocą atrybutów HTML, w tym kontrola uwierzytelniania dwuskładnikowego, przeglądarka modeli 3D i AR, pełnoekranowy interfejs API na iPadach, font-display i, co bardzo ważne, Intelligent Tracking Prevention 2.0, które jest bardziej restrykcyjne niż kiedykolwiek i może mieć znaczący wpływ na funkcjonalność istniejących stron internetowych.
• Bezgłowa biblioteka automatyzacji Chrome Puppeteer jest już dostępna w wersji 1.5. Zapewnia konteksty przeglądarki, aby izolować pliki cookie i inne dane zwykle udostępniane między stronami, a pracownicy mogą teraz być również wykorzystywani do interakcji z robotami internetowymi.
• Google wypuścił Lighthouse 3.0, trzecią główną wersję narzędzia do analizy wydajności, która zawiera nowy interfejs raportu, pewne zmiany punktacji, eksport CSV i pomiar First Contentful Paint.
• Chrome 67 jest już dostępny, wprowadzając progresywne aplikacje internetowe na komputery stacjonarne, a także obsługując interfejs Generic Sensor API i rozszerzając interfejs API zarządzania poświadczeniami o obsługę uwierzytelniania U2F przez USB.
• W ciągu ostatnich miesięcy zaobserwowaliśmy sporo zmian w interfejsach bezpieczeństwa przeglądarek. Po pierwsze, zwrócili uwagę na witryny oferujące bezpieczne połączenie (HTTPS). Następnie zdecydowali się wskazać niezabezpieczone witryny, a teraz Chrome ogłosił nowe zmiany, które nadejdą jesienią, które sprawią, że HTTPS stanie się domyślnym, oznaczając strony HTTP jako „niezabezpieczone”.

Ogólny

• W „Kultze kompleksu” Jeffrey Zeldman pisze o tym, jak często zapominamy, że prostota jest kluczem i celem wszystkiego, co robimy, ogólnym celem projektów i życia. Wyjaśnia, dlaczego tak trudno jest to osiągnąć i dlaczego o wiele łatwiej — i kusząco — uprawiać złożone systemy. Bardzo dobra lektura i zdecydowanie dodam do mojej „wiecznie zielonej” listy.
• Heydon Pickering udostępnił nowy, bardzo interesujący artykuł, który uczy nas prawidłowego budowania komponentu internetowego: Tym razem wyjaśnia, jak zbudować włączający i responsywny moduł „Karta”.

UI/UX

• Cool Backgrounds to fajny projekt poboczny autorstwa Moe Amaya. Jest to internetowy generator wielokątnych teł z gradientami, który może generować wiele wariantów i kształtów. Po prostu piękny.

Obróbka

• Ben Frain dzieli się kilkoma przydatnymi technikami edycji tekstu, które są dostępne w prawie wszystkich nowoczesnych edytorach kodu.

Bezpieczeństwo

• Wraz ze wzrostem popularności ataków na bezpieczeństwo za pośrednictwem DNS, coraz ważniejszy staje się DNS przez HTTPS. Lin Clark wyjaśnia technologię za pomocą kreskówki, aby ułatwić zrozumienie.
• Windows Edge wyświetla teraz podgląd obsługi plików cookie same-site . Atrybut jeszcze bardziej blokującego pliki cookie jest już dostępny w Firefoksie i Chrome, więc Safari jest jedyną główną przeglądarką, która wciąż musi go zaimplementować, ale myślę, że wkrótce pojawi się również w kompilacjach Tech Preview.

Prywatność

• ACLU odkryło, że Amazon oficjalnie połączył siły z organami ścigania i zapewnia technologię masowego rozpoznawania twarzy, która jest już używana w miastach na całym świecie.

Wydajność sieciowa

• KeyCDN poprosił 15 osób, które dużo wiedzą o wydajności sieci, aby podzieliły się z czytelnikami swoimi najlepszymi radami. Teraz udostępnili ten artykuł zawierający wiele przydatnych wskazówek dotyczących wydajności na rok 2018, w tym kilka moich słów.
• Stefan Judis odkrył, że możemy już wstępnie ładować moduły ECMA Script w przeglądarce Chrome 66, dodając link rel="modulepreload" .

Dostępność

• Zbudowanie pokrętła ładowania — na przykład dla aplikacji jednostronicowej podczas ładowania — jest stosunkowo łatwe, ale rzadko myślimy o udostępnieniu ich. Stuart Nelson teraz wyjaśnia, jak to zrobić.
• Paul Stanton dzieli się narzędziami ułatwień dostępu, których powinniśmy używać, aby uzyskać najlepsze wyniki.

JavaScript

• JavaScript był ostatnio zastraszany przez ludzi, którzy faworyzują Elm, Rust, TypeScript, Babel czy Dart. Ale JavaScript zdecydowanie nie jest gorszy, jak wyjaśnia Andrea Giammarchi na świetnych przykładach. Ten artykuł jest również świetną lekturą dla każdego, kto używa jednego z tych innych języków, ponieważ pokazuje kilka pułapek, o których powinniśmy wiedzieć.
• W przypadku wielu projektów chcemy korzystać z narzędzi analitycznych lub innych skryptów gromadzących dane osobowe. Z RODO stało się to o wiele trudniejsze. Yett to fajne narzędzie JavaScript, które pozwala blokować wykonywanie takich zasobów, dopóki użytkownik nie wyrazi na to zgody.
• Ryan Miller stworzył nową publikację zatytułowaną „The Frontendian”, która zawiera jedno z najlepszych wyjaśnień i przewodników po CORS, jakie do tej pory spotkałem.
• Ludzie z Microsoftu stworzyli fajną interaktywną stronę demonstracyjną, aby pokazać, jak mogą i powinny wyglądać powiadomienia Web Push. Jeśli jeszcze nie zaznajomiłeś się z tą technologią, jest to świetny wstęp do tego, jak to wszystko działa i jak zbudować interfejs, który nie przeszkadza użytkownikom.
• Filepond to biblioteka JavaScript do przesyłania plików. Wygląda świetnie i zawiera wiele adapterów dla React, Vue, Angular i jQuery.
• React 16.4 jest już dostępny i wprowadza do biblioteki całkiem nową funkcję: zdarzenia wskaźnika. Ułatwią radzenie sobie z interakcjami użytkowników i są o to proszone od dawna.

CSS

• Oliver Schondorfer opowiada, jak zacząć od czcionek zmiennych w Internecie i jak możemy je stylizować za pomocą CSS. Całkiem kompletne podsumowanie rzeczy, które musisz wziąć pod uwagę, a także możliwych pułapek.
• Wraz z nadchodzącym systemem macOS Mojave obsługującym „tryb ciemny”, Safari zacznie automatycznie ustawiać kolor tła witryn internetowych na czarny, jeśli nie zostanie wyraźnie ustawiony żaden kolor background-color . To świetne przypomnienie, że przeglądarki mogą ustawiać i zmieniać swoje domyślne style i że musimy ostrożnie ustawiać domyślne ustawienia naszej witryny. Nadal mam nadzieję, że „tryb ciemny” zostanie narażony na zapytanie o media CSS, abyśmy mogli oficjalnie dodać dla niego obsługę.
• Rafaela Ferro opowiada, jak wykorzystać CSS Grid do stworzenia galerii zdjęć, która wygląda nie tylko dobrze, ale naprawdę świetnie. Ten artykuł zawiera odpowiedzi na wiele pytań, które regularnie otrzymuję, mówiąc o układzie siatki.
• Marcin Wichary wyjaśnia, jak możemy w krótkim czasie stworzyć ciemny motyw za pomocą nowoczesnych właściwości niestandardowych CSS.

Życie zawodowe

• Anton Sten napisał o moralnych implikacjach dla naszych aplikacji. Znaczące wyjaśnienie, dlaczego czasy „szybkiego poruszania się i niszczenia rzeczy” zdecydowanie się skończyły, ponieważ mamy do czynienia ze sztuczną inteligencją, sieciami społecznościowymi, które wpływają na życie ludzi, oraz kwestiami prywatności egzekwowanymi przez RODO.
• Basecamp ma teraz nowy typ wykresu do wyświetlania statusu projektu: tak zwany „wykres wzgórza” dodaje lepszy kontekst, niż mógłby to zrobić zwykły pasek postępu.
• Ben Werdmuller dzieli się swoimi przemyśleniami na temat CV i tego, jak zawsze nie odzwierciedlają tego, kim jesteś, co robisz i dlaczego powinieneś zostać zatrudniony.

Mam nadzieję, że podobała Ci się ta comiesięczna aktualizacja. Kolejna zaplanowana jest na 13 lipca, więc bądźcie czujni. W międzyczasie, jeśli podoba Ci się to, co robię, rozważ pomoc finansową w finansowaniu Listy Czytelniczej Web Development.

Miłego dnia!

— Anzelm