Review

เทคโนโลยี WebSocket ถูกนำมาใช้อย่างจริงจังในวงการโซเชียลเนตเวิร์ค โดยเฉพาะอย่างยิ่ง Facebook ที่นำมาใช้ในระบบแชท และ แจ้งเตือน
ทำให้ Facebook ดูจะตอบสนองรวดเร็วทันใจ และดูมีชีวิตชีวามากขึ้น นอกจาก Facebook แล้วยังมีเจ้าอื่นใหญ่ ๆ ของโลกอย่าง Google Plus และ Twitter.
เรามาดูกันว่า WebSocket นิยมนำมาประยุกต์ใช้อะไรบ้าง

1. โซเชียลฟีด
ทำให้เรารู้ว่าเพื่อนของเรากำลังทำอะไรอยู่ ถ้าคุณออนไลน์อยู่ก็จะเห็นฟีดเข้ามาอย่างเรียลไทม์

2. เกมส์มัลติเพลย์เยอร์
ทุกวันนี้เราสามารถทำเกมส์บนเว็บได้แค่เพียงเขียน javascript ติดต่อกับ DOM โดยไม่ต้องพึ่ง Flash อีกต่อไปแล้ว และแน่นอนว่า WebSocket สามารถทำให้เห็นปฏิสัมพันธ์ระหว่างผู้เล่นเกมส์อย่างเรียลไทม์

3. การทำงานร่วมกัน อย่างการแก้ไขโค้ด เป็นต้น
สำหรับทีมที่ทำงานด้วยกันแต่อยู่ห่างไกลกัน แม้จะใช้ Git ช่วยในการทำงานร่วมกันได้ แต่ก็ยังมี conflict เกิดขึ้นได้ การแก้ไขงานบางอย่างที่ต้องแก้ไฟล์เดียวกัน หากมาทำแบบเรียลไทม์จะเหมาะกว่า เช่น Google Doc ที่เราสามารถแก้ไขไฟล์ได้พร้อม ๆ กัน และคนอื่น ๆ ก็จะเห็นการแก้ไขของเราทันที

4. ข้อมูลการคลิก
ปกติแล้วหากเราจะบันทึกว่าผู้ใช้งานเว็บเราคลิกที่ส่วนไหนของเว็บไซต์ของเราบ้าง การเก็บข้อมูลการคลิก 1 ครั้งโดยการใช้ 1 HTTP request นั้นเป็นเรื่องที่สิ้นเปลือง การใช้ WebSocket ซึ่งต่อ 1 connection ค้างเอาไว้แล้วส่งข้อมูลทุกการคลิกของผู้ใช้ดูจะเป็นเรื่องที่ประหยัดและเหมาะสมกว่า

5. การแสดงผลการเปลี่ยนแปลงเกี่ยวกับการเงิน (financial ticker)
การซื้อขาย เช่นการอัพเดตราคาหุ้น หรือสิ่งที่มีการเปลี่ยนแปลงราคาตลอดเวลา เป็นสิ่งที่ต้องการความรวดเร็วของการอัพเดตราคา ไม่มีใครอยากจะรอนานในเรื่องนี้

6. อัพเดตข่าวกีฬา
ข้อมูลเกี่ยวกับการแข่งขัน เช่น สกอร์การแข่งขัน หากเข้าชมผ่านเว็บไซต์ ผู้ใช้ย่อมต้องการความรวดเร็วในการรู้ผลสกอร์ ไม่มีใครอยากมานั่งรีเฟรชหน้าเว็บ ยิ่งเร็วเท่าไหร่ยิ่งดี WebSocket ช่วยเรื่องนี้ได้

7. มัลติมีเดียแชท
ในการประชุมทางไกลสามารถทำผ่านเว็บเบราว์เซอร์ได้ และเว็บเบราว์เซอร์สมัยใหม่ก็รองรับการทำงานด้านมัลติมีเดียได้ดี ซึ่งแน่นอนว่าการการส่งข้อมูลแชทก็ต้องเป็น WebSocket

8. แอพพลิเคชั่นที่ใช้โลเคชั่น
การที่เราจะติดตามเส้นทางการเดินทางโดยใช้แอพพลิเคชั่น แอพลิเคชั่นนั้นจะต้องส่งข้อมูลให้เซิร์ฟเวอร์อยู่เรื่อย ๆ การใช้ HTTP request ยิงเข้ามานั้นเป็นเรื่องสิ้นเปลือง ต่อ connection ของ WebSocket ไว้ดีกว่าเห็น ๆ

9. การเรียนออนไลน์
การเรียนทางไกลนั้นมักมีการสื่อสารระหว่างครูกับนักเรียนแบบเรียลไทม์ เช่น แชท และกระดาน(chalk board) เป็นต้น ซึ่งครูต้องเขียนกระดานและสิ่งที่ส่งข้อมูลให้นักเรียนทุกคนเห็นว่าครูเขียนอะไรบนกระดานนั้นคือ WebSocket นั่นเอง

ที่มา : http://www.infoworld.com/d/application-development/9-killer-uses-websockets-230771?page=0,1

 

เว็บไทยก็มีเรียลไทม์

ส่วนเว็บไทยมีน้อยมากที่ได้มีการนำเอา WebSocket มาใช้อย่างจริงจัง หนึ่งในเว็บที่สำคัญ ๆ ที่พอจะเห็นการนำมาใช้ คือชุมชนออนไลน์ wunjun.com

WebSocket ถูกนำมาใช้ประโยชน์ในหลายส่วน บน wunjun.com ซึ่งเป็นเว็บไซต์สังคมออนไลน์ ยกเอามาเป็นกรณีศึกษาตัวอย่างในส่วนต่อไปนี้

ศึกษาเกี่ยวกับ wunjun.com ได้ที่ https://www.blognone.com/node/58032

 

จากรูปด้านบน อธิบายตามตัวเลขได้ดังนี้

  1. การแจ้งเตือน เมื่อมีคนตอบกระทู้ หรือ บล็อก ทำให้ได้รับคำตอบด้วยความสะดวกรวดเร็ว
  2. แสดงผลคำตอบในกระทู้ ใช้ WebSocket เพื่อ push ข้อมูลคำตอบเข้ามาทันทีที่มีการตอบกระทู้
  3. แชท ใช้ WebSocket เพื่อ push ข้อมูลที่เพื่อนพิมพ์มา
  4. สถานะคนออนไลน์ ใช้ WebSocket เพื่อ push ข้อมูลเข้ามาทันทีที่มีคนเข้ามาในกลุ่ม หรือ ปิดออกไปจากกลุ่ม
  5. ความเคลื่อนไหวในกลุ่ม แสดงอัพเดตทันทีที่มีคนตั้ง หรือตอบกระทู้ในกลุ่ม
  6. แชทกลุ่ม ใช้ WebSocket เพื่อทำให้คนที่ออนไลน์อยู่ในกลุ่มสามารถแชทพูดคุยกันได้

เทคโนโลยี WebSocket นี้นับว่ามีข้อดีตรงที่สามารถทำให้เว็บไซต์มีการตอบสนองที่รวดเร็วขึ้น ในอดีตอาจจะติดปัญหาเรื่องเว็บเบราว์เซอร์ที่ไม่รองรับ WebSocket แต่ในอนาคตคาดว่าจะมีการนำมาใช้กันมากขึ้น เพราะเว็บเบราว์เซอร์สมัยใหม่รองรับเทคโนโลยีนี้มากขึ้น จึงทำให้เป็นที่คาดการณ์ว่าอีกสองสามปีจากนี้ไป อุตสาหกรรมเว็บไซต์จะในบ้านเราจะมีการนำเอา WebSocket มาใช้กันมากขึ้น

Hiring! บริษัทที่น่าสนใจ

Carmen Software company cover
Carmen Software
Hotel Financial Solutions
Next Innovation (Thailand) Co., Ltd. company cover
Next Innovation (Thailand) Co., Ltd.
We are web design with consulting & engineering services driven the future stronger and flexibility.
KKP Dime company cover
KKP Dime
KKP Dime บริษัทในเครือเกียรตินาคินภัทร
Kiatnakin Phatra Financial Group company cover
Kiatnakin Phatra Financial Group
Financial Service
Fastwork Technologies company cover
Fastwork Technologies
Fastwork.co เว็บไซต์ที่รวบรวม ฟรีแลนซ์ มืออาชีพจากหลากหลายสายงานไว้ในที่เดียวกัน
Thoughtworks Thailand company cover
Thoughtworks Thailand
Thoughtworks เป็นบริษัทที่ปรึกษาด้านเทคโนโยลีระดับโลกที่คว้า Great Place to Work 3 ปีซ้อน
Iron Software company cover
Iron Software
Iron Software is an American company providing a suite of .NET libraries by engineer for engineers.
CLEVERSE company cover
CLEVERSE
Cleverse is a Venture Builder. Our team builds several tech companies.
Nipa Cloud company cover
Nipa Cloud
#1 OpenStack cloud provider in Thailand with our own data center and software platform.
Bangmod Enterprise company cover
Bangmod Enterprise
The leader in Cloud Server and Hosting in Thailand.
CIMB THAI Bank company cover
CIMB THAI Bank
MOVING FORWARD WITH YOU - CIMB is the leading ASEAN Bank
Bangkok Bank company cover
Bangkok Bank
Bangkok Bank is one of Southeast Asia's largest regional banks, a market leader in business banking
MuvMi (Urban Mobility Tech Co.,Ltd.) company cover
MuvMi (Urban Mobility Tech Co.,Ltd.)
Shape the future of urban mobility towards affordable, clean, and safe solutions
T.N. Digital Solution Co., Ltd. company cover
T.N. Digital Solution Co., Ltd.
TNDS has been involving in every first move of banking’s major digital transformation.
KBTG - KASIKORN Business-Technology Group company cover
KBTG - KASIKORN Business-Technology Group
KBTG - "The Technology Company for Digital Business Innovation"
Siam Commercial Bank Public Company Limited company cover
Siam Commercial Bank Public Company Limited
"Let's start a brighter career future together"
Icon Framework co.,Ltd. company cover
Icon Framework co.,Ltd.
Global Standard Platform for Real Estate แพลตฟอร์มสำหรับธุรกิจอสังหาริมทรัพย์ครบวงจร มาตรฐานระดับโลก
REFINITIV company cover
REFINITIV
The Financial and Risk business of Thomson Reuters is now Refinitiv
H LAB company cover
H LAB
Re-engineering healthcare systems through intelligent platforms and system design.
The Gang Technology Co., Ltd. company cover
The Gang Technology Co., Ltd.
We're a Digital Agency that helps our customers transform their business into digital with ease.
LTMH company cover
LTMH
LTMH มุ่งเน้นการพัฒนาผลิตภัณฑ์ที่สามารถช่วยพันธมิตรของเราให้บรรลุเป้าหมาย
Seven Peaks company cover
Seven Peaks
We Drive Digital Transformation
Wisesight (Thailand) Co., Ltd. company cover
Wisesight (Thailand) Co., Ltd.
The Best Choice For Handling Social Media · High Expertise in Social Data · Most Advanced and Secure
MOLOG Tech company cover
MOLOG Tech
We are Modern Logistic Platform, Specialize in WMS, OMS and TMS.
Data Wow Co.,Ltd company cover
Data Wow Co.,Ltd
We enable our clients to realize increased productivity by solving their most complex issues by Data
LINE Company Thailand company cover
LINE Company Thailand
LINE, the world's hottest mobile messaging platform, offers free text and voice messaging + Call
LINE MAN Wongnai company cover
LINE MAN Wongnai
Join our journey to becoming No.1 food platform in Thailand

เกมส์ -> เกม

อัพเดท => อัพเดต

บราวเซอร์ => เบราว์เซอร์

แอพพลิเคชั่น => แอพพลิเคชัน

เซิฟเวอร์ => เซิร์ฟเวอร์

และสิ่งที่ส่งข้อมูลให้นักเรียนทุกคนเห็นว่าคูเขียนอะไรบนกระดาน

คู => ครู

บน wunjun.com เพื่อทำเปลี่ยนเว็บบอร์ด ให้เป็นสังคมออนไลน์ที่ไม่ธรรมดาได้

เพื่อทำเปลี่ยน ?

เทคโนโลยี web socket นี้นับว่ามีข้อดีตรงที่สามารถทำให้เว็บไซต์ทีการตอบสนองที่รวดเร็วขึ้น

web socket => WebSocket

ทีการตอบสนอง => มีการตอบสนอง

ช่วยยกตัวอย่างโค้ดมาพอเข้าใจด้วยครับ และจะแก้ไขปัญหาเข้าเว็บที่มีการใช้ WebSocket และ JS หนัก ๆ โหลดช้าได้ยังไงครับ
ปล. เว็บที่ยกตัวอย่างผมเข้าโดยเครือข่าย ... 3G โหลดช้าไม่มาเลยครับ 1 นาทีกว่า ๆ มา ผมปิดหนีเลย ความเร็ว 384 kb
ปล2. โฆษณาแฝง?