Generator BlurHash

Nie, i to najczęściej zaskakuje. BlurHash nie jest formatem obrazu — to 20-30 znaków, które dekoder rozwija do pikseli. Twoja aplikacja potrzebuje dekodera, aby je wyświetlić. Jeśli chcesz czegoś, co działa bez żadnego dekodera, użyj zamiast tego przycisków URI danych lub pobierania jako PNG: oba dają prawdziwy PNG rozmytego placeholdera, większy, ale gotowy do wstawienia w atrybut src lub zapisania jako plik na dysku.

Cztery w poziomie i trzy w pionie to typowa wartość domyślna, od której zaczyna to narzędzie. Poniżej tego traci się poczucie, gdzie w kadrze coś się znajduje; powyżej hash szybko rośnie przy bardzo małym widocznym zysku, bo wynik i tak będzie rozmyty. Dziewięć na dziewięć to 166 znaków — sześć razy więcej niż 4×3, dla placeholdera, któremu nikt się dokładnie nie przygląda.

Ponieważ średnia jest obliczana w świetle liniowym, a nie na bajtach sRGB. Zakodowanie testowego gradientu, którego kanały sRGB dają średnią rgb(130, 110, 95), daje hash 1×1, który dekoduje się do rgb(147, 116, 103). To nie błąd — błędem jest bezpośrednie uśrednianie wartości zakodowanych gammą, i dlatego naiwnie uśrednione miniatury często wyglądają na mętne. Średnia liniowa jest tą percepcyjnie poprawną.

Nie. Wartość „punch” jest stosowana dopiero przy dekodowaniu, więc ciąg znaków pozostaje identyczny bez względu na jej ustawienie. Jest tu dodany, ponieważ większość bibliotek dekodujących udostępnia ten sam parametr, a przydatne jest zobaczenie jego efektu, zanim wybierzesz wartość we własnym kodzie.

Nie. Format nie ma kanału alfa, więc przezroczysty PNG jest kodowany tak, jakby został spłaszczony na tło znajdujące się na płótnie. Dla obrazów z rzeczywistą przezroczystością zwykle lepszym wyborem jest kolor zastępczy niż rozmycie.

Nie. Jest dekodowany, próbkowany w dół i przekształcany bezpośrednio na stronie. Zarówno koder, jak i dekoder to czysta arytmetyka działająca w Twojej przeglądarce, bez wysyłania jakiegokolwiek żądania w żadnym momencie.

Placeholder pasujący do kolorów i ogólnej kompozycji obrazu robi dwie użyteczne rzeczy. Rezerwuje właściwą przestrzeń, dzięki czemu nic się nie przesuwa, gdy obraz się pojawia — to główna przyczyna skarg na przesunięcia układu na stronach bogatych w obrazy. A także od razu daje oku coś wiarygodnego, dzięki czemu ładowanie wydaje się krótsze niż taki sam czas oczekiwania na szare pole, bo jest na co patrzeć, zamiast na co czekać.