Sedem princípov pre vytváranie moderných webových aplikácií. Webové rozhranie

V poslednej dobe hlavne vo vzťahu k UX a výkonu.

Chcem predstaviť 7 použiteľných princípov pre webové stránky, ktoré chcú používať JavaScript na ovládanie svojho používateľského rozhrania. Tieto princípy sú výsledkom mojej práce webdizajnéra, ale aj dlhoročného používateľa WWW.

JavaScript sa stal nepopierateľne nepostrádateľným nástrojom pre front-end vývojárov. Teraz sa jeho pôsobnosť rozširuje do ďalších oblastí, ako sú servery a mikrokontroléry. Tento programovací jazyk si vybrali prestížne univerzity, aby študentov naučil základy informatiky.

Zároveň je tu množstvo otázok ohľadom jeho úlohy a konkrétneho využitia, na ktoré mnohí ťažko odpovedajú, vrátane autorov frameworkov a knižníc.

• Mal by sa JavaScript používať ako náhrada za funkcie prehliadača: história, navigácia, vykresľovanie?
• Umiera backend? Musím vôbec vykresľovať HTML?
• Je pravda, že jednostránkové aplikácie (SPA) sú budúcnosť?
• Mal by JS generovať stránky na webe a vykresľovať stránky vo webových aplikáciách?
• Musím použiť techniky ako PJAX alebo TurboLinks?
• Aký je presný rozdiel medzi webovou stránkou a webovou aplikáciou? Mala by ostať jedna?

Nasleduje môj pokus odpovedať na tieto otázky. Snažil som sa preskúmať, ako používať JavaScript z pohľadu používateľa (UX). Najmä dal Osobitná pozornosť myšlienka minimalizácie času, ktorý potrebuje používateľ na získanie údajov, ktoré ho zaujímajú. Počnúc základmi sieťových technológií a končiac predikciou budúceho správania používateľov.

1. Vykresľovanie stránok na serveri

tl;DR: Vykresľovanie na serveri sa nerobí kvôli SEO, ale kvôli výkonu. Vziať do úvahy dodatočné žiadosti získať skripty, štýly a následné požiadavky API. V budúcnosti zvážte použitie metódy push HTTP 2.0.

V prvom rade musím upozorniť na častú chybu oddeľovania „aplikácií vykreslených serverom“ od „Jednostránkových aplikácií“. Ak chceme dosiahnuť najlepší zážitok z pohľadu používateľa, tak by sme sa nemali obmedzovať na takéto limity a opustiť jednu alternatívu v prospech druhej.

Dôvody sú celkom zrejmé. Stránky sa prenášajú cez internet, ktorý má fyzické obmedzenia, ako Stuart Cheshire pamätne ilustroval vo svojej slávnej eseji „Je to latencia, hlúposť“:

Vzdialenosť medzi Stanford a Boston je 4320 km.
Rýchlosť svetla vo vákuu je 300 x 10^6 m/s.
Rýchlosť svetla v optickom vlákne je približne 66% rýchlosti svetla vo vákuu.
Rýchlosť svetla v optickom vlákne je 300 x 10^6 m/s * 0,66 = 200 x 10^6 m/s.
Oneskorenie jednosmerného prenosu do Bostonu 4320 km / 200 x 10^6 m/s = 21,6 ms.
Spätná latencia 43,2 ms.
Ping zo Stanfordu do Bostonu na modernom internete je asi 85 ms (…)
takže, moderné vybavenie Internet prenáša signál rýchlosťou 0,5-násobku rýchlosti svetla.

Uvedený výsledok 85 ms možno zlepšiť (a už je o niečo lepší), ale je dôležité pochopiť, že oneskorenie pri prenose informácií cez internet má fyzické obmedzenie, bez ohľadu na to, o koľko sa zvýši šírka pásma na počítačoch používateľov. .

Je to dôležité najmä kvôli rastúcej popularite aplikácií JavaScript, ktoré zvyčajne obsahujú iba značky.