มีอะไรในงาน Tencent Openhouse#14

Yannawut Kimnaruk
4 min readDec 27, 2019

--

เมื่อวันที่ 19 ธันวาคมที่ผ่านมา มีการจัดงาน Tencent Openhouse#14 ครับ ซึ่งทาง Tencent Thailand จะจัดงาน Openhouse เพื่อนำเสนอข้อมูลด้าน IT ที่น่าสนใจทุกเดือน ครั้งนี้เนื้อหายังคงอัดแน่นเหมือนเช่นเคย ผู้ที่มาบรรยายทั้ง 3 ท่านล้วนเป็นพนักงานจาก Tencent Thailand รับรองว่าเนื้อหาไม่ธรรมดา

สำหรับผู้อ่านที่อยากทราบเนื้อหางาน Tencent Openhouse#13 สามารถเข้าไปอ่านที่ผมเขียนได้ ที่นี่ เลยครับ

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

เนื้อหาภายในงานจะแบ่งเป็น 3 ส่วน

- Sanook.com ใช้ Next.js อย่างไร
- A.I. in real world: Video recommendation
- 2035: The start of A.I. revolution

Sanook.com ใช้ Next.js อย่างไร

ส่วนแรกนั้นบรรยายโดยคุณเต้ Senior Engineer เนื้อหาส่วนใหญ่เกี่ยวกับการสร้างเว็บไซต์โดยใช้ Next.js แนวคิดหลายอย่างน่าสนใจทีเดียวครับ ในที่นี้ผมจะไม่เขียนลงลึกไปถึงการเขียนโปรแกรม สำหรับผู้ที่ต้องการเห็นตัวอย่างโค้ดแนะนำให้อ่านจาก Powerpoint ของคุณเต้ได้เลยครับ ทำไว้อ่านง่ายทีเดียว(ลิงค์อยู่ท้ายบทความ)

เกริ่นนำสักเล็กน้อย Joox.com และ Sanook.com นั้นเป็นเว็บไซต์แบบ Universal Web App โดยทั้ง 2 เว็บไซต์นี้จะยังคงเล่นเพลงอยู่แม้ว่าเราจะกดเปลี่ยน Tab ในบราวเซอร์ไปเข้าชมเว็บไซต์อื่น เพื่อให้สามารถฟังเพลงได้อย่างต่อเนื่องไม่มีสะดุด

Next.js นั้นช่วยให้เราสามารถสร้าง Universal Web App ได้ง่ายขึ้นนั่นเองครับ

การนำเสนอจะอยู่ในรูปแบบตอบคำถาม 4 คำถามนะครับ

คำถาม 1 : หน้าเว็บไซต์โหลดช้าจัง ทำไงดี?
คำอธิบาย:
เราอาจเขียนให้เว็บไซต์โหลดทุกส่วนของหน้าเว็บจนเสร็จทั้งหมด แล้วค่อยแสดงผล โดยโหลดส่วนที่ 1 เสร็จค่อยไปโหลดส่วนที่ 2 ต่อ

วิธีแก้ไข
1. ยังไม่ต้องโหลดเนื้อหาที่ไม่สำคัญสำหรับคนที่เข้ามาดูเว็บ เช่น บทความเพิ่มเติมที่อยู่ด้านล่างของเว็บไซต์ที่แสดงบทความ
2. ทำงานแบบ Parallel นั่นคือ ให้ทุกส่วนของเว็บไซต์โหลดไปพร้อมกัน ซึ่งแสดงผลเร็วกว่าตอนแรกที่ทำงานแบบ Waterfall คือ โหลดส่วนที่ 2 หลังส่วนที่ 1 โหลดเสร็จ

คำถาม 2 : Hooks จะมาแทน Render Props และ HOCs หรือไม่?
คำอธิบาย:
รายละเอียดเยอะมากครับ แนะนำให้อ่านใน Powerpoint โดยสรุปคือแต่ละคำสั่งมีประโยชน์แตกต่างกันไป Hooks ไม่สามารถมาแทนที่ได้ทั้งหมด

คำถาม 3 : จัดระเบียบไฟล์อย่างไรดี? (เน้นไปที่การสร้างเว็บไซต์)
คำอธิบาย:
วิธีจัดระเบียบไฟล์ที่นิยมมี 2 วิธี
1. Type base: เก็บไฟล์ประเภทเดียวกันไว้ด้วยกัน
2. Feature Base: เก็บไฟล์ที่ทำงานลักษณะเดียวกันไว้ด้วยกัน
คุณเต้ ประยุกต์ใช้ทั้ง 2 วิธีครับ โดยเก็บไฟล์ที่เกี่ยวข้องกันไว้ด้วยกัน

คำถาม 4 : เว็บไซต์ที่สร้างมาได้คะแนน PageSpeed น้อยจัง ปรับยังไงดี?
คำอธิบาย:
PageSpeed คือการให้คะแนนเว็บไซต์ของ Google ซึ่งบอกถึงความเร็วในการโหลดเว็บไซต์นั้น ๆ คะแนนเต็มอยู่ที่ 100 ถ้าคะแนนน้อยแสดงว่าโหลดช้าจะทำให้ผู้ใช้ไม่อยากเข้ามาใช้ และเว็บไซต์นั้นจะถูกจัดอันดับการค้นหาไว้ท้าย ๆ เมื่อหาผ่าน Google อีกด้วย

PageSpeed คำนวณโดยเฉลี่ยคะแนนจากหลายปัจจัยครับ ปัจจัยที่มีน้ำหนักมากที่สุดคือ Time to Interactive (TTI) หรือเวลาทั้งหมดที่ใช้ในการโหลดเว็บนั้นเอง ซึ่งเว็บไซต์ที่เขียนด้วย JavaScript มักจะเสียคะแนนตรงส่วนนี้ไปเยอะ

ในเดือนมกราคมปี 2020 Google จะเริ่มใช้วิธีการวัดผลใหม่ โดยลดน้ำหนักของ TTI และเพิ่มปัจจัยใหม่ 2 ตัว คือ Largest Contentful Paint (LCP) กับ Total Blocking Time (TBT) เรามาทำความรู้จักปัจจัยใหม่ 2 ตัวนี้กัน
LCP คือ เวลาที่ใช้ตั้งแต่เปิดเว็บจนกระทั่งโหลดส่วนที่ขนาดใหญ่ที่สุดของเว็บนั้นเสร็จสิ้น

TBT คือ เวลารวมของเวลาที่เกิน 50 มิลลิวินาที (ms) ในแต่ละ Task เช่น ถ้า Task A ใช้เวลาทั้งหมด 500 ms Blocking time ของ Task A จะคิดเป็น 450 ms

หลังจากรู้เช่นนี้แล้วเราจะทำอะไรได้บ้างเพื่อให้คะแนน PageSpeed ของเราดีขึ้น
วิธีนึง คือ หั่น Task ให้สั้นๆ เพื่อลด TBT เพราะถ้า Task ใช้เวลาน้อยกว่า 50 ms Blocking Time จะเป็น 0

วิธีอื่นๆ อาทิ ใช้ Dynamic Import และ Lazy loading

A.I. in real world: Video recommendation

ส่วนนี้บรรยายโดยดร. อ้วน Data Scientist

ดร. อ้วนเล่าถึง paper งานวิจัยเรื่อง Video recommendation ของ Youtube ครับเราจะได้มาเจาะลึกกันว่า Youtube รู้ได้ยังไงว่าเราอยากดูคลิปอะไร แล้วสามารถแนะนำคลิปได้ตรงใจสุดๆ

Paper ที่ยกมาเล่า 3 ฉบับจะมี 2 ฉบับที่เชื่อมโยงกัน ส่วนอีก 1 ฉบับ จะแยกออกมาต่างหาก

Paper 1: Collaborative Deep Metric Learning for Video Understanding

เริ่มที่ paper ที่ไม่เกี่ยวข้องกับ paper อื่นก่อนเลยนะครับ

ปัญหาที่เราต้องการแก้มี 2 อย่าง

  1. แยกแยะได้ว่าวิดีโออะไรที่คล้ายกันและผู้ชมมักจะดูต่อกัน
  2. แนะนำ video playlist เฉพาะบุคคลโดยดูจากประวัติการชมวิดีโอ

วิธีการ

  1. แปลงวิดีโอเป็นชุดตัวเลข
    1.1) แยกวิดีโอออกเป็นภาพและเสียง
    1.2) แปลงภาพเป็นตัวเลข
    - Image feature extraction
    - เก็บข้อมูลรูป 1 รูป ทุก 1 วินาที
    - ใช้ JFT-Inception-V3 เพื่อดึงคุณสมบัติต่าง ๆ ของรูปภาพ (JFT-Inception-V3 คือ Machine Learning Model ของ Youtube ที่สร้างจาก ชุดข้อมูล JFT ของ Google)
    - ทำ Video Embedding เพื่อแปลงเป็นตัวเลข
    1.3) แปลงเสียงเป็นตัวเลข
    - Audio feature extraction
    - แปลงเสียงเป็นภาพตามความถี่ของเสียง (Spectrogram)
    - ทำ Audio Embedding เพื่อแปลงเป็นตัวเลข
    1.4) รวมชุดตัวเลขของภาพและเสียง

2. สร้าง Machine Learning Model โดยใช้วิดีโอ 3 คลิป
Anchor: Reference Video
Positive: วิดีโอที่มักจะเล่นหลัง Anchor
Negative: วิดีโอที่ไม่เคยเล่นหลัง Anchor
Minimize loss โดยให้ Anchor ใกล้ Positive แต่ห่าง Negative

ปัญหาที่พบ: Deep learning ช้า
วิธีแก้ไข: 1. Extreme quantization (บีบอัดข้อมูล) 2. Extreme caching
3. Optimize equation

Paper 2+3: Deep Neural Networks for YouTube Recommendations + Recommending What Video to Watch Next: A Multitask Ranking System

Paper พูดถึง Candidate generation+Ranking

Paper ที่ 3 จะพูดถึง Ranking ล้วน ๆ

Candidate generation:
- เลือกวิดีโอหลักร้อยจากวิดีโอทั้งหมดหลักล้าน
- Extreme Classification
- ใช้ข้อมูลของวิดีโอ (คล้าย ๆ วิธีใน paper แรก) ประกอบกับข้อมูลของผู้ชม อาทิ เพศ เขตที่อยู่ อายุ ประวัติการชม ประวัติการค้นหา

Ranking:
- เรียงวิดีโอที่ถูกเลือกมาแล้วจากขั้งตอน Candidate generation
- Max Engagement (click+ระยะเวลาที่ดู) & Satisfaction (like)→ Multi-objective optimization ใช้วิธี Multi-gate Mixture-of-Expert (MMoE)
- ลด bias ที่ user มักจะกดดูคลิปแรกที่เห็นในช่อง recommend

Key Takeaway

  • Youtube ใช้ข้อมูลทุกอย่างเกี่ยวกับเรา
  • Youtube พยายามให้เราดู Youtube นานขึ้น Like เยอะขึ้น โดยใช้ A.I.
  • YouTube ประมวลผลวิดีโอจำนวนหลายล้าน โดยใช้เวลาเสี้ยววินาที ซึ่งต้องอาศัย supercomputer ราคาแพงมากๆๆๆ

สุดท้ายผมชอบคำพูดนึงของ ดร. มากกก ที่ว่า

การที่เราทำนายได้แม่นขึ้นแแม้เพียงนิดเดียวนั้นสำคัญมาก เพราะถ้าเราทำนายได้แม่นขึ้นแค่ 1% จำนวน 20 ครั้ง สุดท้ายเราจะแม่นขึ้นมากถึง 22% ดังนั้นอย่าหยุดพัฒนาตัวเอง แล้ววันนึงเราจะได้เห็นตัวเองในเวอร์ชั่นใหม่ที่ดีกว่าเดิม

2035: The start of A.I. revolution

เนื้อหาส่วนนี้เหมือนมาฟังทอร์คโชว์​เลยครับ ฟังได้เพลิน ๆ ผมขอชื่นชมผู้พูดทั้ง 2 ท่าน คุณรันและคุณเคน Head of Innovation & Solution Group กับ Senior Technical Platform Manager ที่หาข้อมูลมาได้ละเอียดและตั้งสมมติฐานได้ดีมากๆ

ใครไม่ทราบว่า A.I. คืออะไร ลองอ่าน ที่นี่ ครับ

ทำไมต้องปี 2035? → ปี 2035 มีสภาพแวดล้อมที่พร้อมสำหรับยุค A.I. ประกอบด้วย 3 องค์ประกอบ

A.I. Environment
  1. Machine Learning Model: คอมพิวเตอร์ได้รับการพัฒนาให้มีความสามารถในการคิดระดับสูง อาทิ การจดจำใบหน้า, การทำนายแนวโน้มในอนาคต, รถยนต์ไร้คนขับ ตัวอย่างทั้งหมดที่กล่าวมาพร้อมตั้งแต่ตอนนี้แล้วครับ แต่ที่ต้องรอถึงปี 2035 คือองค์ประกอบในข้อ 2
  2. Computing Power หรือ ความเร็วในการประมวลผลของคอมพิวเตอร์
    อ้างอิงจาก Moore’s Law ความเร็วของ CPU จะเพิ่มขึ้น 2 เท่าทุกๆ 1.5–2 ปี
    แต่ตอนนี้ติดปัญหาที่ขนาดของทรานซิสเตอร์ซึ่งปัจจุบันเล็กถึง 5 นาโนเมตร เล็กกว่าไวรัสอีกครับ การสร้างทรานซิสเตอร์ที่ขนาดเล็กกว่า 1 นาโนเมตรนั้นยากมากเพราะมีข้อจำกัดเรื่องขนาดอะตอม
    สิ่งที่เป็นความหวังในตอนนี้คือ Quantum Computing ครับ อธิบายอย่างย่อ ๆ คือ โดยปกติการเก็บข้อมูล 1 bit จะเก็บข้อมูลเป็น 0 หรือ 1 แต่ Quantum Computing 1 bit สามารถเก็บข้อมูล 0 และ 1 ได้พร้อมกันด้วยสมบัติ Superposition ของคลื่นช่วยให้เก็บข้อมูลได้มากขึ้นนั่นเอง
    Quantum Computing นั้นไม่ได้มาแทนคอมพิวเตอร์ที่ใช้อยู่ในปัจจุบัน แต่จะมาแทน supercomputer ที่ Data Center ครับ
  3. Cellular Network Speed หรือความเร็วเน็ตมือถือ จะเข้ามามีบทบาทในการเชื่อมต่อข้อมูลของเราไปยัง Data Center เพื่อทำการประมวลผลต่างๆ ซึึ่งปัจจุบันยังคงมีการพัฒนาอยู่เรื่อย ๆ คงต้องรอดูกันไปครับว่าปี 2035 เน็ตมือถือจะพัฒนาไปถึงกี่ G

เทคโนโลยีแห่งอนาคต (เทคโนโลยีบางอย่างพัฒนามาได้ระดับนึงแล้ว)​

  • สังเคราะห์เนื้อสัตว์+พืช
  • เสื้อผ้าปรับอุณหภูมิให้เหมาะสมเฉพาะบุคคลผ่านเส้นประสาท
  • ที่พักตามความต้องการของผู้อยู่อาศัย
  • ยารักษาตาม DNA ของผู้ป่วย
  • เครื่องอ่านคลื่นสมอง
  • Traffic Control
  • Stock Exchange
  • AI รักษากฎหมาย
  • หนัง+เพลงสร้างโดย AI
  • AI ที่สามารถสร้าง AI ได้
  • AI ที่มีความรู้สึก

ทั้งหมดนี้คือเรื่องราวที่ผมได้ฟังในงาน Tencent Openhouse#14 ครับ หวังว่าทุกท่านจะได้รับความรู้และสนุกกับการอ่านไม่มากก็น้อยนะครับ

เอกสาร Powerpoint ต่าง ๆ และคลิปบรรยากาศภายในงานสามารถรับชมได้ ที่นี่ เลยครับ

--

--

Yannawut Kimnaruk
Yannawut Kimnaruk

No responses yet