6 คะแนน โดย xguru 2020-04-06 | 2 ความคิดเห็น | แชร์ทาง WhatsApp
  • อธิบายขั้นตอนการคอมไพล์ของ Svelte ให้เข้าใจได้ง่าย

#1 อ่านไฟล์ .svelte แล้วแปลงเป็น AST

→ HTML แยกพาร์สเอง, Script ใช้ Acorn, CSS ใช้ css-tree

#2 สำรวจ AST เพื่อติดตามรีเฟอเรนซ์และการพึ่งพา

→ สร้างอินสแตนซ์ Component แล้วค้นหาตัวแปรเพื่อทำเครื่องหมาย

#3 สร้างบล็อกโค้ดและชิ้นส่วนต่าง ๆ

→ DOM/SSR Renderer

#4 สร้างโค้ด

2 ความคิดเห็น

 
heycalmdown 2020-04-07

ไม่กี่วันก่อนก็มี Toast UI Editor(https://th.news.hada.io/topic?id=1823) ที่เคยแนะนำไปแล้ว และ Language Server Protocol(https://en.wikipedia.org/wiki/Language_Server_Protocol) เช่นกัน ดูเหมือนว่าโปรเจ็กต์ที่ใช้ AST จะมีมากขึ้นเรื่อย ๆ นะครับ ผมเหมือนเคยเห็นข้อเสนอเมื่อก่อนด้วยว่าแทนที่จะส่งไฟล์ JS เป็นข้อความ ให้ส่งเป็น AST เพื่อให้เอนจินของเบราว์เซอร์ตีความได้เร็วขึ้น บทความนี้(https://blog.cloudflare.com/binary-ast) ไม่ใช่อันนั้นเสียทีเดียว แต่ก็ดูเป็นแนวคิดที่คล้ายกันครับ

ถ้าไม่ใช่ AST ที่ถูกสร้างขึ้นโดยปริยาย แต่เป็นการลงมือสร้าง AST ด้วยตัวเองให้มีความหมายมากขึ้น สุดท้ายมันก็จะกลายเป็นภาษาฟังก์ชันนัลสาย S-Expression นี่แหละครับ ถ้ามาเจอกันตรงกลางก็น่าสนุกดีนะครับ

 
xguru 2020-04-06

พออ่านจบแล้ว น่าจะช่วยให้ผู้มีส่วนร่วมจากภายนอกคอนทริบิวต์กับโค้ดของ Svelte ได้สะดวกขึ้น