Ответ 1

Socket.IO использует WebSockets, когда это возможно.

Его преимущества заключаются в том, что он упрощает использование WebSockets, как описано в № 2, и, вероятно, что более важно, он обеспечивает отказоустойчивость к другим протоколам в случае, если WebSockets не поддерживается в браузере или сервере. Я бы не стал использовать WebSockets напрямую, если вы не знакомы с тем, в каких средах они не работают, и вы можете обойти эти ограничения.

Это хорошо читается как в WebSockets, так и в Socket.IO.

http://davidwalsh.name/websocket

Ответ 2

Заблуждения

Существует несколько распространенных заблуждений относительно WebSocket и Socket.IO:

• Первое заблуждение состоит в том, что использование Socket.IO значительно проще, чем использование WebSocket, что, похоже, не так. См. Примеры ниже.

• Второе заблуждение состоит в том, что WebSocket широко не поддерживается в браузерах. Подробнее см. Ниже.

• Третье заблуждение состоит в том, что Socket.IO снижает соединение в качестве резервного в старых браузерах. Фактически предполагается, что браузер устарел и запускает соединение AJAX с сервером, которое впоследствии обновляется в браузерах, поддерживающих WebSocket, после обмена некоторым трафиком. Подробнее см. Ниже.

Мой эксперимент

Я написал модуль npm, чтобы продемонстрировать разницу между WebSocket и Socket.IO:

• https://www.npmjs.com/package/websocket-vs-socket.io
• https://github.com/rsp/node-websocket-vs-socket.io

Это простой пример серверного и клиентского кода - клиент подключается к серверу с помощью WebSocket или Socket.IO, и сервер отправляет три сообщения через 1 с, которые добавляются в DOM клиентом.

на стороне сервера

Сравните пример на стороне сервера, используя WebSocket и Socket.IO, чтобы сделать то же самое в приложении Express.js:

Сервер WebSocket

Пример сервера WebSocket с использованием Express.js:

var path = require('path');
var app = require('express')();
var ws = require('express-ws')(app);
app.get('/', (req, res) => {
  console.error('express connection');
  res.sendFile(path.join(__dirname, 'ws.html'));
});
app.ws('/', (s, req) => {
  console.error('websocket connection');
  for (var t = 0; t < 3; t++)
    setTimeout(() => s.send('message from server', ()=>{}), 1000*t);
});
app.listen(3001, () => console.error('listening on http://localhost:3001/'));
console.error('websocket example');

Источник: https://github.com/rsp/node-websocket-vs-socket.io/blob/master/ws.js

Сервер Socket.IO

Пример сервера Socket.IO с помощью Express.js:

var path = require('path');
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', (req, res) => {
  console.error('express connection');
  res.sendFile(path.join(__dirname, 'si.html'));
});
io.on('connection', s => {
  console.error('socket.io connection');
  for (var t = 0; t < 3; t++)
    setTimeout(() => s.emit('message', 'message from server'), 1000*t);
});
http.listen(3002, () => console.error('listening on http://localhost:3002/'));
console.error('socket.io example');

Источник: https://github.com/rsp/node-websocket-vs-socket.io/blob/master/si.js

на стороне клиента

Сравните клиентский пример использования WebSocket и Socket.IO, чтобы сделать то же самое в браузере:

Клиент WebSocket

Пример клиента WebSocket с использованием ванильного JavaScript:

var l = document.getElementById('l');
var log = function (m) {
    var i = document.createElement('li');
    i.innerText = new Date().toISOString()+' '+m;
    l.appendChild(i);
}
log('opening websocket connection');
var s = new WebSocket('ws://'+window.location.host+'/');
s.addEventListener('error', function (m) { log("error"); });
s.addEventListener('open', function (m) { log("websocket connection open"); });
s.addEventListener('message', function (m) { log(m.data); });

Источник: https://github.com/rsp/node-websocket-vs-socket.io/blob/master/ws.html

Клиент Socket.IO

Пример клиента Socket.IO с использованием ванильного JavaScript:

var l = document.getElementById('l');
var log = function (m) {
    var i = document.createElement('li');
    i.innerText = new Date().toISOString()+' '+m;
    l.appendChild(i);
}
log('opening socket.io connection');
var s = io();
s.on('connect_error', function (m) { log("error"); });
s.on('connect', function (m) { log("socket.io connection open"); });
s.on('message', function (m) { log(m); });

Источник: https://github.com/rsp/node-websocket-vs-socket.io/blob/master/si.html

Сетевой трафик

Чтобы увидеть разницу в сетевом трафике, вы можете запустить мой тест. Вот результаты, которые я получил:

Результаты WebSocket

2 запроса, 1,50 КБ, 0,05 с

Из этих двух запросов:

• Сама HTML-страница
• обновление подключения к WebSocket

(Запрос обновления соединения виден в инструментах разработчика с ответом 101 "Ответы на переключение" ).

Результаты Socket.IO

6 запросов, 181,56 КБ, 0,25 с

Из этих 6 запросов:

• сама страница HTML
• Socket.IO JavaScript (180 килобайт)
• запрос на длинный опрос AJAX
• второй длинный запрос AJAX запроса
• третий длинный запрос AJAX для опроса
• обновление подключения к WebSocket

Скриншоты

Результаты WebSocket, которые я получил на localhost:

Результаты Socket.IO, которые я получил на localhost:

Проверьте себя

Быстрый старт:

# Install:
npm i -g websocket-vs-socket.io
# Run the server:
websocket-vs-socket.io

Откройте http://localhost:3001/ в своем браузере, откройте инструменты разработчика с помощью Shift + Ctrl + I, откройте вкладку "Сеть" и перезагрузите страницу с помощью Ctrl + R, чтобы увидеть сетевой трафик для версии WebSocket.

Откройте http://localhost:3002/ в своем браузере, откройте инструменты разработчика с помощью Shift + Ctrl + I, откройте вкладку "Сеть" и перезагрузите страницу с помощью Ctrl + R, чтобы увидеть сетевой трафик для версии Socket.IO.

Чтобы удалить:

# Uninstall:
npm rm -g websocket-vs-socket.io

Совместимость с браузером

По состоянию на июнь 2016 года WebSocket работает над всем, кроме Opera Mini, включая IE выше 9.

Это совместимость браузера WebSocket от Могу ли я использовать с июня 2016 года:

См. http://caniuse.com/websockets для актуальной информации.

Ответ 3

Мне нужно предоставить аргумент против использования socket.io.

Я думаю, что использование socket.io исключительно потому, что оно имеет резервные копии, не является хорошей идеей. Пусть IE8 RIP.

В прошлом было много случаев, когда новые версии NodeJS разбивали socket.io. Вы можете проверить эти списки для примеров... https://github.com/socketio/socket.io/issues?q=install+error

Если вы идете разработать приложение для Android или что-то, что должно работать с вашим существующим приложением, вы, вероятно, будете в порядке работать с WS сразу же, socket.io может дать вам некоторые проблемы там...

Плюс модуль WS для Node.JS поразительно прост в использовании.

Ответ 4

Использование Socket.IO в основном похоже на использование jQuery - вы хотите поддерживать старые браузеры, вам нужно написать меньше кода, а библиотека предоставит резервные копии. Socket.io использует технологию websockets, если она доступна, а если нет, проверяет лучший доступный тип связи и использует ее.

Ответ 5

Socket.IO использует WebSocket, и когда WebSocket недоступен, используется резервный алгоритм для создания соединений в режиме реального времени.