okjsp 5/14 소모임 발표자료 ( socket.io )

1. SOCKET.IO
Real-­‐Time
Applica-on

2. 소
개
Smart Innovation 기술팀
최
민
우
60%
25%
15%
Javascript Objective-C
Etc...
Mobile & Web
Javascript
- Sencha Touch
- NodeJS
- jQuery

3. Guillermo Rauch

4. express
async
underscore
connect
jade
socket.io
redis
request
grunt
NodeJS
...

5. Socket.io
WebSocket,
FlashSocket,
AJAX
Long
Polling
AJAX
Mul:
part
Streaming,
IFrame,
JSONP
Polling

6. 실시간
양방향
통신

7. Polling
Long-polling
iframe
Streaming
WebSocket
Flash

8. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
✦ 단점
빠르고 안정적
모바일 지원 안함
Flash.net.Socket을 이용한 소켓통신

9. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
✦ 단점
폭넓은 브라우저 호환성
모바일 지원 안함
메모리 릭 발생
iframe을 숨겨놓고 메시지를 계속보냄

10. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
✦ 단점
호환성이 좋음
불필요한 트래픽 발생
주기적으로 요청하여 결과확인

11. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
✦ 단점
호환성이 좋음
이벤트마다 연결 시도
요청응답을 서버 이벤트 발생시 받음

12. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
✦ 단점
매번 연결을 안해도 통신이 가능
지원 브라우저가 적음
오작동 하는 브라우저도 있음
요청응답을 완료하지않고 데이터를 받음

13. Polling
Long-polling
iframe
Streaming
WebSocket
Flash
✦ 장점
다른방식에 비해 빠름
HTML5 Spec
✦ 단점
???

15. Web Socket!

17. npm
install
socket.io-­‐client
Server Client
시작
npm
install
socket.io

18. Broadcast
Public
Private

19. Server
Client Client Client
Public socket.sockets.emit()

20. Server
Client Client Client
Broadcast socket.broadcast.emit()

21. Server
Client Client Client
Private socket.sockets[id].emit()

22. 설정
Server Client

23. 불안요소 존재
통신단절 구간 ( 이동시, 엘레베이터 등 )
잦은 데이터 교환 시 부적합함
모바일에서... 느리다?
But.. 가능성이 있다

25. Socket.io
한번 시작해보세요

26. https://github.com/learnboost/socket.io/
https://github.com/LearnBoost/socket.io-client
https://github.com/guille
http://helloworld.naver.com/helloworld
http://socket.io
http://caniuse.com/#search=websocket
Reference
https://github.com/LearnBoost/socket.io-spec

27. Q & A