1- AJAX (Asynchronous JavaScript and XML) é uma técnica que
permite que aplicações web troquem dados com um servidor
de forma assíncrona, sem a necessidade de recarregar a
página inteira. Isso melhora a experiência do usuário ao
possibilitar atualizações de partes específicas da página sem
interromper a navegação ou carregar todo o conteúdo
novamente.
2-
Síncrona: A requisição é feita de forma bloqueante, ou seja, o
código JavaScript aguarda a resposta do servidor antes de
prosseguir com a execução. Isso pode tornar a página não
responsiva até que a resposta seja recebida.
Assíncrona: A requisição é feita de forma não bloqueante,
permitindo que o código JavaScript continue a execução enquanto
aguarda a resposta do servidor. Isso proporciona uma experiência
de usuário mais fluida, pois a página pode continuar sendo usada
enquanto a comunicação com o servidor ocorre em segundo plano.
3-
Melhoria da Experiência do Usuário: Atualizações parciais da
página tornam a interação mais ágil e eficiente.
Redução do Tráfego de Dados: Somente os dados necessários são
trocados, economizando largura de banda.
Desempenho Aprimorado: A página responde mais rapidamente às
ações do usuário, sem precisar recarregar todo o conteúdo.
Menor Tempo de Carregamento: Atualizações rápidas podem ser
feitas sem recarregar a página inteira.
4-
XMLHttpRequest: Um objeto JavaScript que permite o envio e
recebimento de dados de um servidor de forma assíncrona. Pode
ser usado para realizar requisições HTTP e manipular a resposta
recebida.
Fetch API: Uma API mais moderna que oferece uma interface mais
poderosa e flexível para fazer requisições de rede. Baseada em
Promises, oferece uma sintaxe mais limpa e intuitiva em
comparação ao XMLHttpRequest.
5-
Criação da Requisição: Inicializa o objeto XMLHttpRequest ou faz a
chamada fetch().
Configuração da Requisição: Define o tipo de requisição (GET,
POST, etc.), URL e outras configurações (headers, parâmetros).
Envio da Requisição: Envia a requisição ao servidor.
Recebimento da Resposta: Recebe a resposta do servidor assim
que estiver disponível.
Processamento da Resposta: Manipula a resposta, como por
exemplo, atualizando o DOM com os dados recebidos.
6-
GET: Usado para solicitar dados do servidor. É utilizado
principalmente para obter informações sem alterar o estado do
servidor.
POST: Usado para enviar dados ao servidor, frequentemente para
criar ou atualizar recursos. A requisição POST pode modificar o
estado do servidor.
7- Após receber a resposta, verifique o formato e o status da
resposta. Se estiver em formato JSON, use o método
response.json() com a Fetch API ou JSON.parse() com o
XMLHttpRequest para converter a string JSON em um objeto
JavaScript. Em seguida, manipule os dados conforme necessário,
como atualizar o DOM para refletir as mudanças.
8-
jQuery: A biblioteca jQuery oferece o método $.ajax(), que simplifica
a sintaxe e o manuseio de requisições AJAX. É amplamente
utilizada devido à sua simplicidade e compatibilidade com
navegadores mais antigos.
Axios: Uma biblioteca baseada em Promises que oferece uma API
intuitiva e poderosa para fazer requisições HTTP. Suporta
interceptadores de requisição e resposta, facilitando o tratamento
de erros e o gerenciamento de requisições.
Fetch API: Embora não seja uma biblioteca, a Fetch API é uma
alternativa moderna ao XMLHttpRequest e é amplamente suportada
em navegadores modernos. Sua interface baseada em Promises
oferece uma maneira limpa e flexível de fazer requisições de rede.
