Come posso scoprire qual è il metodo migliore per una situazione? Qualcuno può fornire alcuni esempi per conoscere la differenza in termini di funzionalità e prestazioni?
Risposte:
XMLHttpRequest è l'oggetto browser grezzo che jQuery racchiude in una forma più utilizzabile e semplificata e in funzionalità coerenti cross browser.
jQuery.ajax è un richiedente Ajax generale in jQuery che può eseguire qualsiasi tipo e richiesta di contenuto.
jQuery.gete jQuery.postd'altra parte può emettere solo richieste GET e POST. Se non sai cosa sono, dovresti controllare il protocollo HTTP e imparare un po '. Internamente queste due funzioni utilizzano jQuery.ajaxma utilizzano impostazioni particolari che non è necessario impostare da soli semplificando così la richiesta GET o POST rispetto all'utilizzo jQuery.ajax. GET e POST sono comunque i metodi HTTP più utilizzati (rispetto a DELETE, PUT, HEAD o anche altri esotici usati raramente).
Tutte le funzioni jQuery usano XMLHttpRequest oggetti in background, ma forniscono funzionalità aggiuntive che non è necessario eseguire da soli.
Quindi, se stai usando jQuery, ti consiglio vivamente di usare solo la funzionalità jQuery . Dimenticati del XMLHttpRequesttutto. Utilizzare variazioni della funzione di richiesta jQuery adatte e in tutti gli altri casi utilizzare $.ajax(). Quindi non dimenticare che ci sono altre funzioni comuni relative a jQuery Ajax a $.get(), $.post()e $.ajax(). Bene, puoi semplicemente usare $.ajax()per tutte le tue richieste, ma dovrai scrivere un po 'più di codice, perché ha bisogno di un po' più di opzioni per chiamarlo.
È come se fossi in grado di comprarti un motore per auto che dovresti creare attorno a un'intera macchina con sterzo, freni, ecc ... Le case automobilistiche producono auto complete, con un'interfaccia amichevole (pedali, volante ecc.) quindi non devi fare tutto da solo.
$.poste $.getl'unica cosa più lenta è una piccola quantità di codice prima che $.ajaxvenga chiamato. Ma se scrivessi le tue routine usando direttamente XHR le cose potrebbero essere un po 'ottimizzate ma potrebbero essere più buggate. Ti suggerisco di restare dalla parte di jQuery. Ti renderà la vita più facile. E considerando il fatto che la chiamata asincrona impiega molto più tempo del codice che la emette, probabilmente non noterai alcuna differenza evidente tra queste chiamate.
$.ajaxle tue chiamate coerenti ovunque, se lo desideri. Finché non usi XHR direttamente, sei bravo a farlo in entrambi i casi.
Ognuno di loro utilizza XMLHttpRequest. Questo è ciò che il browser utilizza per effettuare la richiesta. jQuery è solo una libreria JavaScript e il metodo $ .ajax viene utilizzato per creare un XMLHttpRequest.
$ .post e $ .get sono solo versioni abbreviate di $.ajax. Fanno più o meno la stessa cosa ma rendono più veloce la scrittura di una richiesta AJAX: $.posteffettua una richiesta HTTP POST e $.getuna richiesta HTTP GET.
GETrichiesta invierà tutti i dati nella stringa URL, che può essere limitata da client / server ( stackoverflow.com/questions/2659952/… ). Una POSTrichiesta invia tutti i dati nelle intestazioni, quindi il limite di dimensione dell'URL non dovrebbe essere un problema (a meno che tu non abbia nomi di file e cartelle molto lunghi per il tuo script!).
GET. Se stai cercando di inviare qualcosa (ad esempio postando un tweet) POST, usa
jQuery.get è un wrapper per jQuery.ajax , che è un wrapper per XMLHttpRequest.
XMLHttpRequest e Fetch API (sperimentali in questo momento) sono le uniche in DOM, quindi dovrebbero essere le più veloci.
Ho visto molte informazioni che non sono più accurate, quindi ho creato una pagina di test in cui chiunque può testare la versione dalla versione che è la migliore in qualsiasi momento:
https://jsperf.com/xhr-vs-jquery-ajax-vs-get-vs-fetch
Dai miei test di oggi risulta che solo jQuery non è una soluzione pulita o anche veloce, i risultati per me su dispositivi mobili o desktop mostrano che jQuery è, almeno, l'80% più lento di XHR2, se stai usando troppo ajax, nei dispositivi mobili ci vorrà molto tempo per caricare un semplice sito.
L'utilizzo stesso è anche nel collegamento.
jQuery.post e jQuery.get simulano i tipici caricamenti di pagine, vale a dire, fai clic su un pulsante di invio e ti porta a una nuova pagina (o ricarica la stessa pagina). post e get differiscono leggermente nel modo in cui i dati vengono inviati al server (un buon articolo a riguardo può essere trovato qui .
jQuery.ajax e XMLHttpRequest sono caricamenti di pagina simili a post e get, tranne per il fatto che la pagina non cambia. Qualsiasi informazione restituita dal server può essere utilizzata da javascript localmente per essere utilizzata in qualsiasi modo, inclusa la modifica del layout della pagina. Normalmente vengono utilizzati per eseguire lavori asincroni mentre l'utente può ancora navigare nella pagina. Un buon esempio di ciò sarebbero le capacità di completamento automatico caricando dinamicamente da un database i valori per completare un campo di testo. La differenza fondamentale tra jQuery.ajax e XMLHttpRequest è che jQuery.ajax utilizza XMLHttpRequest per ottenere lo stesso effetto ma con un'interfaccia più semplice. Se usi jQuery ti incoraggio a restare con jQuery.ajax.
Vecchio post. ma voglio comunque rispondere, una differenza che ho dovuto affrontare lavorando con Web Workers (javascript)
i web worker non possono avere alcun accesso a livello di interfaccia utente. Ciò significa che non puoi accedere a nessun elemento DOM nel codice JavaScript che intendi eseguire utilizzando i web worker. Non è possibile accedere a oggetti come finestra, documento e genitore nel codice web-worker.
Come sappiamo, la libreria jQuery è legata al DOM HTML e consentirla violerebbe la regola "nessun accesso DOM". Questo può essere un po 'doloroso perché metodi come jQuery.ajax, jQuery.post, jQuery.get non possono essere utilizzati nei web worker. Fortunatamente, puoi utilizzare l' oggetto XMLHttpRequest per effettuare richieste Ajax.
Per quanto riguarda i metodi jQuery, .poste lo .getfanno semplicemente .ajaxinternamente, il loro scopo è quello di astrarre alcune delle opzioni non necessarie .ajaxe fornire rispettivamente alcuni valori predefiniti appropriati a quel tipo di richiesta.
Dubito che ci sia molta differenza di prestazioni tra uno qualsiasi dei 3.
Il .ajaxmetodo di per sé esegue XMLHttpRequest, sarà fortemente ottimizzato come per il resto di jQuery, ma probabilmente non sarà così efficiente come se avessi personalizzato l'intera interazione da solo .. ma questa è la differenza tra scrivere molto codice o la scrittura jQuery.ajax.