In che modo i siti Web di notizie, ad esempio Forbes / Zdnet, uniscono senza soluzione di continuità una pagina Web in un'altra?


14

Se vai ad esempio:

Quando arrivi in ​​fondo alla Pagina, viene caricata una nuova notizia e l'URL nel mio browser Internet cambia nell'URL di questa prossima notizia. Quindi mi chiedevo come una pagina Web potesse caricare quasi istantaneamente la pagina Web successiva con un ritardo quasi trascurabile tra le pagine. Stanno, ad esempio, pre-scaricando la pagina Web della storia di Next News e quindi caricando la pagina web molto velocemente?


1
Tieni premuto il Endtasto e vedrai il ritardo del processo di caricamento.
MonkeyZeus,

5
La domanda più importante è perché lo fanno.

Risposte:


25

La risposta breve è che il codice Javascript sul lato client della pagina rileva quando ci si avvicina "troppo vicino" alla fine della pagina e chiede al server ulteriori dati quando ciò accade.

Senza essere troppo tecnici, non stanno ricaricando l'intera pagina web. Invece il codice Javascript su quella pagina richiede più dati dal server, quindi quando riceve i nuovi dati, li aggiunge alla pagina corrente. Le parti della pagina che non devono essere modificate rimangono completamente invariate.

Il modo più moderno per farlo è utilizzare le funzionalità di modifica della cronologia HTML5 , che sembrano essere quelle utilizzate da quei siti.


4
Nella tua descrizione manca un passaggio: dove cambiano effettivamente la cronologia, oltre ad aggiungere più dati alla pagina. Il che rende il tuo “modo più moderno di fare questo ” in qualche modo imbarazzante, perché questo si riferisce al processo di modifica della storia, che in realtà non viene menzionato nella risposta. (Grammaticamente, ciò significherebbe lasciare invariato il resto della pagina, o forse aggiungere dati alla pagina, che di solito è fatto con AJAX, e non può essere fatto con le funzionalità di modifica della cronologia HTML5.)
KRyan,

E che dire della modifica dell'URL, come può accadere senza forzare una ricarica? Perché sul tuo link, se ricarichi una 'pagina modificata' (es. /second), Si verifica un errore. Ciò non accade con il sito di notizie di OP: cambiano l'URL esattamente in modo da poterlo condividere.
OJFord,

@OllieFord è a questo che serve la storia delle API. history.pushStatee history.replaceStateti consente di modificare l'URL nella barra degli indirizzi senza allontanarti dalla pagina corrente. È la sostituzione più moderna del vecchio trucco di cambiare il frammento di URL ( #something), con un grande vantaggio che l'API di cronologia consente di inviare URL "reali" che il server può partecipare alla generazione, mentre il frammento deve essere completamente supportato dal lato client.
Hobbs,

Ah ok. Ma come ho detto, la demo è rotta, il che è fonte di confusione.
OJFord,

Per qualche ragione, la demo di storia che conoscevo era completamente rotta quando venne posta questa domanda, quindi quel link fu il primo che riuscivo a trovare e che sembrava funzionare. Sentiti libero di suggerire un link migliore.
Ixrec,

20

Una chiave importante per capire cosa sta succedendo: è possibile, tramite Javascript, impostare l'URL nella barra degli indirizzi senza reindirizzare l'utente. Per vederlo in azione, incolla il codice seguente nella console di un browser supportato. Si noti che cambia la barra degli indirizzi in http://programmers.stackexchange.com/yay.html.

history.pushState(null,null,'/yay.html')

Il vantaggio di questo approccio è che se i segnalibri dell'utente dopo aver fatto scorrere una storia, il segnalibro saprà dove inviare l'utente. Lo scorrimento infinito dei risultati di ricerca di DeviantArt è un bell'esempio di questo comportamento.


Aspetta, DeviantArt ha implementato la modifica della cronologia nei suoi risultati di ricerca, quindi puoi effettivamente collegarti a / bookmark / altrimenti registrare una determinata pagina? Questo è ... piuttosto qualcosa. Tuttavia, per quanto tempo rimarrebbero determinati risultati su una determinata pagina per una determinata query? Se aggiungi un segnalibro, domani non mi aspetto di vedere gli stessi risultati su quella particolare pagina ... Devo ricordarmi di indagare su questo.
KRyan,

@KRyan modifica semplicemente il offsetparametro che salta una certa distanza nel gruppo di risultati. Dato che l'ordinamento predefinito sembra essere "sempre popolare", i risultati sono probabilmente alquanto stabili, ma sicuramente non se si passa dall'ordinamento a "più recente" e si cerca qualcosa di popolare.
Hobbs,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.