Backbone.js งานกระดูกๆ บน javascript

ช่วงนี้ได้มีเวลาลง effort เต็มที่กับ Web Application หลังจากตัว POC เสร็จไประดับนึงแล้ว
ความยากของงานคราวนี้ดูเหมือนจะเป็นการ port โปรแกรมจากเดิมที่เป็น Client - Server
ให้มาอยู่ในรูปของWeb Application ครับ

ต้องยอมรับว่าสมัยนี้ Web Application  หากไม่มี Ajax หรือ Javascript ที่เกี่ยวกับ Transition แล้ว
Web นั้นๆ จะดูธรรมดาลงไปเลยทันที ซึ่งทั้งนี้การเขียน code javascript แบบสะเปะสะปะ
อาจจะทำให้งานงอกภายหลังได้ เหมือนกับที่ปวดหัวกับ Legacy Code ในขณะนี้ ....

Backbone.js เป็น Library อีกตัวที่ช่วยวาง Framework ในการเขียน javascript ของเรา
ให้อยู่ในรูปแบบของ MVC Design Pattern ที่ช่วยให้เราสามารถ manage code ในแต่ละส่วน
แยกออกจากกันอย่างมีประสิทธิภาพแต่ใน Backbone.js นี้จะมีลักษณะแตกต่าง
กับ MVC Design Pattern ทั่วๆ ไปในภาษาอื่นตรงที่ Controller ใน Framework ตัวนี้
จะไม่มีให้เห็นชัดเจน หากแต่จะเป็น Component อื่นๆ ที่ช่วยในการ Controller อันได้แก่

Router - ไว้ทำการ navigate แบบ hashtag
Collection - ไว้จัดการข้อมูลที่เป็น List ของ Model
Sync - ไว้ Synchronize Data กลับไปยัง Server ยามที่เราจำเป็น

ส่วน  Model ก็ เก็บ Data  ,  View ก็เก็บ การแสดงผล
เนื่องด้วยการทำงานของ Backbone.js จะเป็น Event Driven ผสมกับ Model Driven ..
การติดต่อกับ Server จึงไม่จำเป็นที่จะต้องเขียน Ajax Query เองตรงๆ แต่สามารถเก็บ URL
ที่ใช้ในการ Access Data ไว้ในตัว Model เองได้เลย โดย Backbone.js นั้น จะ built-in  REST Service
มาให้อยู่แล้ว ทำให้เราสามารถเรียกใช้ REST ให้ตรงกับความต้องการของ Backbone ได้โดยตรง ....
เช่น

Application = Backbone.Model.extend({
             url: '/auth/status'
});
var myApp = new Application();

เวลาเราต้องการดึงข้อมูล เราสามารถเขียนได้ในลักษณะนี้

myApp.fetch();

Backbone.js จะทำการไป query ตาม URL ที่เรากำหนดไว้ใน model ให้ทันที

ซึ่งจะควบคุมโดย REST service ตามการทำงานแบบ CRUD.

การใช้งานส่วนใหญ่ก็มีเวปฝรั่งเยอะพอสมควรแล้ว ขอไม่เขียนละกันครับ :)
ตัวอย่างแบบละเอียด สามารถดูได้จาก

Todos

http://documentcloud.github.com/backbone/examples/todos/index.html

โดยมี sourcecode annotation อธิบายทีละบรรทัดว่าทำอะไรเพื่ออะไรอย่างไรบ้างโดยดูจาก

http://documentcloud.github.com/backbone/docs/todos.html


ขอบ่นจากประสบการณ์ที่ใช้โดยตรงเลยดีกว่า

ข้อดี :

• Sample App ใช้ Learning Curve ต่ำ 
• Backbone.js มีขนาดค่อนข้างเล็ก เมื่อเทียบกับ Framework อื่น
  ( โดยรวม JQuery กับ UnderScore )
• template engine ( underscore ) ค่อนข้างเก่ง และ เข้าใจง่าย
• code ไม่เละ สามารถแยก object และ class ได้อย่างชัดเจน
• Delegate events จาก DOM มาจัดการใน View ได้โดยตรง
• เหมาะสำหรับทำ Application แบบ Stateless ( Asynchronous )

ข้อเสีย

• Document น้อย 
• ด้วย Pattern ที่เป็น MVC อาจทำให้เกิด over-design ได้ ต้องระวัง
• หากทำ SPA ต้องคำนึงถึง Performance
• อาจจะไม่เหมาะสำหรับบาง Web Application Framework ที่ไม่สามารถแก้ HTTP Header ได้

โดยรวมแล้ว อาจจะค่อนข้างเป็น Trend ใหม่สำหรับการทำ Webapp แบบ Single Page Application
แต่ในยุคสมัยนี้ Browser ค่อนข้างเก่งกว่าเมื่อก่อนมาก ในบางครั้งการทำ Application ที่ต้องติดต่อกับ Server ภายนอกโดยครอบคลุมทุก Platform นั้น จึงเหมาะสมที่จะใช้เป็น Web Application มากกว่าการเสียเวลามานั่งเขียน Native App โดยไม่จำเป็น เพราะหากเรามี Protocol ที่ดีอยู่แล้ว ไม่ว่า Web Application หรือ Native Application ก็ไม่ใช่เรื่องใหญ่อีกต่อไป