Lesson 6.10. Client-Server Interaction and Script Loading

Published: 05 January 2025
on channel: Web-garage
228
21

Playlist clone on Yandex.Zen: https://dzen.ru/suite/3764854c-4f30-4...

🚀 Client-Server Interaction: From HTTP to WebSocket and Script Loading Optimization

In this video, we'll cover the main methods of interaction between the client (browser) and the server, and also discuss how to properly include JavaScript for maximum performance.

🔄 1. Synchronous Interaction
📖 Description: The classic method, in which each new page loads completely.
🌐 Example: [topfood.club](https://topfood.club/reczeptyi/pervyi...) – when you navigate between pages, you'll see a full reload.
⚙️ How it works:
The browser sends an HTTP request to the server.
The server returns a new HTML page.
The browser reloads the page.

⚡ 2. Asynchronous Interaction (SPA)
📖 Description: The page is updated without reloading. Used in Single Page Applications (SPA).
🌐 Example: [yoric.ru](https://yoric.ru) – content is updated dynamically.
⚙️ How it works:
A single HTML page and JavaScript are loaded.
Data is loaded via an API (e.g., Fetch or Axios).
Content is updated without reloading the page.

✅ Advantages of SPA:
Smooth operation.
Fast response.
Separation of frontend and backend.

❌ Disadvantages of SPA:
Difficulties with SEO.
Slow initial load.

🌐 3. WebSocket
📖 Description: A protocol for real-time data exchange.
🎮 Use cases:
Chat applications.
Online games.
Real-time notifications.

✅ Advantages:
Low latency.
Efficiency for real-time applications.

📜 JavaScript Loading Features

🛠️ Async and defer attributes:
async: The script is loaded asynchronously and executed immediately after loading.
defer: The script is executed only after the HTML has fully loaded.

📌 When to use:
async: For analytics, advertising scripts.
defer: For DOM-dependent scripts.

🔗 Useful links:
[WebSocket documentation on MDN](https://developer.mozilla.org/ru/docs...)
[HTTP Overview on MDN](https://developer.mozilla.org/ru/docs...)

If you liked the video, don't forget to give it a 👍, subscribe to the channel, and click the bell 🔔 so you don't miss new lessons!

#async #defer #websocket


On this page of the site you can watch the video online Lesson 6.10. Client-Server Interaction and Script Loading with a duration of hours minute second in good quality, which was uploaded by the user Web-garage 05 January 2025, share the link with friends and acquaintances, this video has already been watched 228 times on youtube and it was liked by 21 viewers. Enjoy your viewing!