Hvordan Ajax fungerer

Hvordan Ajax fungerer
Ajax omfatter et sett med nyttige nettutviklingsteknikker som brukes til å utvikle dynamiske og raske websider. Bak kulissene deler den små biter av dataene, slik at websidene kan oppdateres asynkront. Dette sier at ved å bruke Ajax, vil HTML -sideelementer bli oppdatert uten omlasting.

Denne oppskrivningen vil diskutere komponentene i Ajax og hvordan Ajax fungerer. Vi vil snakke om arbeidet med Ajax i noen topp nettbaserte applikasjoner. Dessuten vil en sammenligning mellom den konvensjonelle og Ajax -modellen bli gitt. Så la oss starte!

Komponenter i Ajax

Ajax er et sett med webutviklingsteknikker. Det er basert på de undergitte komponentene:

  • I Ajax -modellen, Xhtml/html regnes som kjernespråk og kaskadestil (CSS) som presentasjonsspråk.
  • De Dokumentobjektmodell brukes til å vise dynamisk innhold og interaksjonsformål.
  • For utveksling av data er Ajax avhengig av XML, og XSLT brukes til datamanipulering.
  • De XmlhttpRequest Objekt brukes til den asynkrone kommunikasjonen i modellen.
  • Til slutt, JavaScript brukes til å koble alle disse teknologiene i Ajax.

Hvordan Ajax fungerer

Hver gang brukere sender noen forespørsel fra brukergrensesnittet, eller en hendelse oppstår, for eksempel en knapp som klikkes eller websiden lastes inn, oppretter JavaScript et "XmlhttpRequest”Objekt. Etter det sender det opprettede objektet en httpRequest til webserveren. Deretter serverprosessen den mottatte HttpRequest ved å samhandle med databasen. Når de nødvendige dataene blir hentet fra databasen, genereres et svar, og serveren sender tilbake det JSON eller XML Data til nettleseren. I neste trinn behandler JavaScript de returnerte dataene og oppdaterer websiden deretter.

Det undergitte bildet illustrerer også arbeidet med Ajax:

Ajax praktiske eksempler

Tenk på den autofullføringsfunksjonen til Google nettsted. Det hjelper deg med å fullføre nøkkelordene mens du skriver. Google-websidene forblir de samme når nøkkelordene endres i sanntid. Da internett ikke var så mye fremskritt tidlig 90 -tallet, Google -websiden ble lastet inn på nytt når den viste en ny anbefaling av nettleserskjermen.

I 2004, Google begynte å legge inn Ajax -modellen bak kulissene på Google Map og Google Mail. Det tillater datautveksling og gjør det mulig for presentasjonslaget å fungere uten å forstyrre.

Ajax brukes nå ofte i flere nettbaserte applikasjoner for å forenkle kommunikasjonen med serveren. Vi har også samlet en liste over noen andre praktiske Ajax -eksempler:

  • Chatterom: Nå for tiden er innebygde chatterom blant de fleste funksjonene på et nettsted. Nettsteder tilbyr chatterom på hjemmesiden deres, ved å bruke som du kan kommunisere med kundeservicerepresentanten. Du kan utforske websiden mens du sender og mottar meldinger fra chatterom. Ajax laster ikke på nytt hele siden under disse samtidige aktivitetene.
  • Rangerings- og stemmesystemer: Har du noen gang deltatt i noe online stemmeskjema, eller har du gitt en produktvurdering etter å ha kjøpt det på nettet? Ajax brukes i begge nevnte systemer. Etter å ha gitt vurderingen eller avstemningen, vil nettstedet oppdatere beregningsdelen, mens resten forblir uendret.
  • Trending Varsel om Twitter: Twitters trendy varsel er en flott funksjon for å følge med på det som skjer i verden. Ajax ble nylig ansatt på Twitter for oppdateringene, og den oppdaterer applikasjonen når nye tweets blir sendt angående trendy emner uten å påvirke hovednettstedet.

Kort sagt, Ajax -modeller letter multitasking. Anta at du legger merke til en applikasjon som utfører to aktiviteter samtidig, uten å sette den ene i tomgang og den andre i en aktiv tilstand. I disse scenariene fungerer Ajax i bakgrunnen.

Sammenligning av Ajax og konvensjonell modell

Ajax -modell Konvensjonell modell
Når en hendelse inntreffer, definerer nettleseren en JavaScript -samtale, og aktiverer XMLHttpRequest. Nettleseren gir en HTTP -forespørsel til serveren i den konvensjonelle modellen.
Det opprettede objektet sender deretter en HTTP -forespørsel til serveren i bakgrunnen. Dataene blir mottatt og deretter hentet av serveren.
Forespørselen mottas, nødvendige data blir hentet og sendes tilbake til nettleseren. Nettleseren godtar serverresponsen.
De hentet dataene sendes tilbake til nettleseren og vises direkte på siden. I Ajax -modellen utføres ingen sideinnlastingsoperasjoner i mellomtiden. Nettleseren laster på nytt siden for å oppdatere den. Under denne operasjonen må brukerne vente til siden blir lastet på nytt. Denne handlingen er tidkrevende og legger ekstra belastninger på serveren.

Konklusjon

Ajax tillater websider å bli oppdatert asynkront mens du utveksler dataene i bakgrunnen. Dette sier at elementer på websiden kan oppdateres uten omlasting av siden. Denne oppskrivningen diskuterte komponentene i Ajax og hvordan Ajax fungerer. Vi har snakket om arbeidet med Ajax i noen topp nettbaserte applikasjoner. Dessuten er det også gitt en sammenligning mellom de konvensjonelle og Ajax -modellene.