7 chronicznych błędów przeglądarek nękających sieć

Przeglądarki internetowe są niesamowite. Gdyby nie przeglądarki, nie bylibyśmy w stanie łączyć się prawie tak dobrze z użytkownikami i klientami, przesyłając nasze dane i dokumenty do ich komputerów stacjonarnych, tabletów i telefonów. Niestety, cała wspaniała zawartość dostarczana przez przeglądarkę internetową sprawia, że ​​jesteśmy bardziej sfrustrowani, gdy renderowanie nie jest tak eleganckie ani wolne od błędów, jak byśmy chcieli.

Jeśli chodzi o tworzenie stron internetowych, jesteśmy na łasce przeglądarek tak samo, jak jesteśmy im zadłużeni. Każda usterka na dowolnej platformie wyskakuje, zwłaszcza gdy powoduje awarię maszyn naszych użytkowników. A dzięki wzornictwu jako takiej premii za wyróżnienie się lub dopasowanie, każda gruba linia lub niewłaściwie zastosowany kolor niszczy estetyczne doznanie, nad którym pracowaliśmy. Nawet najmniejszy błąd, taki jak dodanie dodatkowego piksela do szerokości linii lub nieznaczne przesunięcie tabeli, może spowodować frustrujące wrażenia użytkownika, nie wspominając o kosztach odkrywania, weryfikacji i obchodzenia się z nim.

Oczywiście było gorzej. Ogromne różnice między przeglądarkami zostały w dużej mierze usunięte dzięki wierności standardom sieciowym W3C. Różnice, które pozostają, można generalnie zignorować dzięki rozprzestrzenianiu się bibliotek, takich jak jQuery, które nie tylko ułatwiają hakowanie JavaScript, ale także dokumentują sposoby, w jakie przeglądarki nie są takie same.

Te biblioteki mają zwyczaj zamrażania błędów przeglądarki na miejscu. Jeśli firmy zajmujące się przeglądarkami naprawią niektóre ze swoich najgorszych błędów, nowe „poprawki” mogą zakłócić stare łatki i obejścia. Nagle „poprawka” staje się problemem, który zakłóca starą stabilność, którą naprawiliśmy usterką. Programiści nie mogą wygrać.

Stabilność zapewniana przez biblioteki takie jak jQuery zachęciła również twórców przeglądarek do przyspieszenia i zautomatyzowania procesów aktualizacji przeglądarek. Mozilla zobowiązuje się do rozpowszechniania nowej wersji Firefoksa co kilka miesięcy. W przeszłości każda wersja byłaby stabilnym celem dla twórców stron internetowych i moglibyśmy umieścić mały GIF na naszych stronach, twierdząc, że działają najlepiej, powiedzmy, w IE5. Teraz licznik przebiegu obraca się tak szybko, że nowa wersja przeglądarki Firefox zostanie wydana w czasie potrzebnym na przesłanie kodu HTML z serwera do klienta.

W międzyczasie prosimy przeglądarki, aby zrobiły o wiele więcej. Witryna mojej lokalnej gazety rzuca moją maszynę na kolana - rozwijające się reklamy typu popover, automatycznie odtwarzane fragmenty wideo, kod dostosowujący reklamy do mojej ostatniej historii przeglądania. Jeśli moja córka przegląda witrynę z lalkami, JavaScript gorączkowo próbuje znaleźć reklamę lalek, która mogłaby mi pokazać. Cała ta magia przygniata procesor.

Wszystko to oznacza, że ​​dzisiejsze błędy w przeglądarkach są rzadsze, ale trudniejsze do ustalenia. Oto przegląd najnowszych gatunków błędów przeglądarek nękających - lub w wielu przypadkach po prostu dokuczliwych - projektantów stron internetowych i programistów.

Układ

Najbardziej widoczne błędy przeglądarki to usterki układu. Baza błędów Bugzilla Mozilli zawiera 10 sekcji dotyczących problemów z układem, ale nie obejmuje to problemów związanych z układem, które są sklasyfikowane jako związane z DOM, CSS lub Canvas. Najważniejszym zadaniem przeglądarki jest ułożenie tekstu i obrazów, a ich prawidłowe wykonanie jest często trudne.

Wiele błędów układu może wydawać się niewielkich do niemal ezoterycznych. Na przykład błąd Bugzilli 1303580 wywołuje przeglądarkę Firefox w celu użycia kursywy czcionki, gdy tagi CSS wzywają do ukośnego. Być może zauważyłby to tylko uzależniony od czcionek. W międzyczasie błąd Bugzilli 1296269 zgłasza, że ​​części liter w Comic Sans są odcinane, przynajmniej w systemie Windows. Projektanci czcionek robią rozróżnienie i to jest dla nich ważne. Kiedy nie mogą uzyskać odpowiedniego wyglądu i sposobu działania we wszystkich przeglądarkach, projektanci stron internetowych mogą być nieco sfrustrowani.

Są setki, tysiące, a może nawet miliony tych błędów. W dniu napotkaliśmy problemy ze znikaniem obrazów w naszym edytorze CMS i tagami obejmującymi, które pojawiają się tylko w modelu DOM.

Wycieki pamięci

Często trudno zauważyć wycieki pamięci. Z definicji nie zmieniają żadnych widocznych właściwości. Strona jest renderowana poprawnie, ale przeglądarka nie czyści po fakcie. Kilka zbyt wielu wizyt w witrynach internetowych, które powodują wyciek, a komputer zwalnia do indeksowania, ponieważ cała pamięć RAM jest zablokowana i zawiera strukturę danych, która nigdy nie zostanie zmieniona. W ten sposób system operacyjny gorączkowo wymienia bloki pamięci wirtualnej na dysk, a Ty spędzasz czas na czekaniu. Najlepszym wyborem jest ponowne uruchomienie komputera.

Szczegóły błędów związanych z wyciekiem pamięci mogą być szalenie tajemnicze i mamy szczęście, że niektórzy programiści poświęcają czas, aby je naprawić. Rozważ problem 640578 ze stosu przeglądarek Chronium. Zmiana części DOM poprzez manipulowanie innerHTMLwłaściwością powoduje wyciek pamięci. Przykładowy fragment kodu z ciasnym, powtarzającym się wywołaniem pętli requestAnimationFramezduplikuje problem. Takich problemów jest dziesiątki.

Oczywiście nie zawsze jest to wina przeglądarki. Na przykład w numerze 640922 Chromium opisano również wyciek pamięci i podano przykład. Dalsza analiza pokazuje jednak, że przykładowy kod tworzył Date()po drodze obiekty do testowania czasu i prawdopodobnie to one były źródłem problemu.

Lampa błyskowa

To całkiem oficjalne. Wszyscy zapomnieli o wspaniałej, wygładzonej grafice i filmach internetowych, które Adobe Flash wprowadził do sieci. Zamiast tego obwiniamy go za wszystkie awarie, które mogły być jego winą lub nie. Teraz jest oficjalnie na emeryturze, ale nie idzie szybko. Wydaje się, że nawet najbardziej przyszłościowe firmy promujące standardy sieciowe nadal mają kod Flash na swoich stronach. Jestem zaskoczony, jak często znajduję kod Flash poza witrynami MySpace i GeoCities.

Dotyka i klika

Nie jest łatwo pogodzić różne typy danych wejściowych, zwłaszcza teraz, gdy tablety i telefony generują dotknięcia, które mogą, ale nie muszą, działać jak kliknięcie myszą. Nie powinno więc dziwić, że w tym obszarze jest mnóstwo błędów. Framework JavaScript Bootstrap przechowuje listę najbardziej irytujących błędów, a niektóre z najgorszych należą do tej kategorii.

Na przykład w Safari czasami brakuje dotknięć palcem tekstu w tagu (151933). Czasami menu nie działają na iPadzie, ponieważ przeglądarka przesunęła prostokąt w poszukiwaniu danych wejściowych (150079). Czasami kliknięcia powodują dziwne poruszanie się przedmiotu - co może nawet wyglądać, jakby zostało to zrobione celowo przez sprytnego projektanta (158276). Wszystko to prowadzi do zamieszania, gdy tekst lub obrazy na ekranie nie reagują w oczekiwany sposób.

Wideo

Plan zawsze zakładał uproszczenie dostarczania dźwięku i obrazu poprzez przeniesienie odpowiedzialności wewnątrz przeglądarki i poza świat wtyczek. To wyeliminowało problemy z interfejsem, ale nie usunęło wszystkich problemów. Lista błędów wideo jest długa, a wiele z nich jest zbyt widocznych. Wpis Bugzilli 754753 opisuje „głównie czerwone i zielone plamy, które zawierają różne obrazy-widma”, a wpis Bugzilli 1302991 „zacina się” z powodu braku lepszego słowa.

Niektóre z najbardziej złożonych problemów pojawiają się, gdy przeglądarki integrują różne mechanizmy szyfrowania zaprojektowane w celu zapobiegania piractwu. Błąd 1304899 sugeruje, że Firefox nie pobiera automatycznie odpowiedniego mechanizmu szyfrowania (EME) z Adobe. Czy to wina Firefoksa? Adobe? A może dziwny proxy?

Błędy wideo będą nadal dominować. Integracja wideo internetowego z innymi formami treści poprzez dodanie tagów wideo do HTML5 otworzyła wiele nowych możliwości dla projektantów, ale każda nowa możliwość oznacza nowe możliwości pojawiania się błędów i niespójności.

Unoszące się

Zdolność strony internetowej do podążania za myszą poruszającą się po stronie pomaga projektantom stron internetowych udzielać użytkownikom wskazówek, jakie funkcje mogą być ukryte za obrazem lub słowem. Niestety, zawisające wydarzenia nie zawsze wspinają się w górę łańcucha tak szybko, jak to tylko możliwe.

Na przykład nowa przeglądarka Microsoft Edge nie ukrywa kursora, gdy mysz znajduje się nad niektórymi elementami wejściowymi (817822). Czasami unoszenie się nie kończy (5381673). Czasami zdarzenie najechania kursorem jest powiązane z niewłaściwym elementem (7787318). Wszystko to prowadzi do nieporozumień i zniechęca do stosowania całkiem zgrabnego efektu.

Złośliwe oprogramowanie

Chociaż kuszące jest zrzucanie całej winy za błędy przeglądarki na programistów przeglądarek, często jest to niesprawiedliwe. Wiele problemów jest powodowanych przez złośliwe oprogramowanie, które ma udawać przydatne rozszerzenia lub wtyczki. W wielu przypadkach złośliwe oprogramowanie robi coś naprawdę użytecznego, potajemnie kradnąc kliknięcia lub handel w tle.

Problem polega na tym, że interfejs rozszerzenia jest dość potężny. Rozszerzenie może wstawiać dowolne tagi i kod do wszystkich witryn internetowych. W odpowiednich rękach jest to bardzo fajne, ale łatwo jest zobaczyć, jak nowy kod z rozszerzenia może uderzyć w kod ze strony internetowej. Co? Nie chciałeś na nowo definiować zachowania $funkcji?

To nie tyle błąd, ile głęboki, filozoficzny problem z bardzo fajną funkcją. Ale z wielką mocą wiąże się wielka odpowiedzialność - być może większa niż jakikolwiek programista. Najlepszym sposobem spojrzenia na ten problem jest uświadomienie sobie, że jest to jedyny obszar, w którym my, użytkownicy, mamy kontrolę. Możemy wyłączyć rozszerzenia i ograniczyć je tylko do kilku stron, na których nie ma problemów. Interfejs API jest nieco zbyt potężny do codziennego użytku - tak potężny, że kusi wywoływanie rozszerzeń API z największymi błędami ze wszystkich. Ale to by zaprzeczyło wszystkiemu, co robi dla nas.

Powiązane artykuły

  • Poza jQuery: Przewodnik eksperta po frameworkach JavaScript
  • Recenzja: przetestowano 7 IDE JavaScript
  • Strzelanina HTML5: Jak sprawdzają się Chrome, Safari, Firefox, IE i Opera
  • Recenzja: 13 frameworków internetowych primo Python
  • Moc leniwego programowania
  • Pobierz: przewodnik rozwoju kariery programisty
  • 7 złych pomysłów na programowanie, które działają
  • 9 złych nawyków programistycznych, które potajemnie kochamy
  • 21 gorących trendów w programowaniu - i 21 wychodzących na jaw