заблуждения

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

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

2. второе заблуждение заключается в том, что с WebSocket не поддерживается в браузерах. См. ниже для получения дополнительной информации.

3. третье заблуждение разве что 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 и сервер отправляет три сообщения в интервалах 1s, которые добавляются в DOM с помощью клиент.

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

сравните пример использования WebSocket на стороне сервера и Socket.IO сделать то же самое в экспрессе.приложение ДШ:

WebSocket Server

пример сервера 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 пример использования сервера Экспресс.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 Client

пример клиента 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 s

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

1. сама HTML страница
2. обновление соединения до WebSocket

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

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

6 запросов, 181.56 КБ, 0.25 s

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

1. сама HTML страница
2. гнездо.ИО по JavaScript (180 КБ)
3. первый длинный запрос AJAX опроса
4. второй AJAX-запроса
5. третий длинный запрос AJAX опроса
6. обновление соединения до WebSocket

скриншоты

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

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

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

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

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

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

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

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

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