(เขียนเมื่อ 2010-01-03 04:49:59 +0700)
บทความแรกของปี 2010 จะว่าไป หลังจากเที่ยวแล้ว แทนที่สมองจะปลอดโปร่ง กลับคิดอะไรไม่ออกซะงั้น ก็โดนไปตั้งแต่วันที่ 30 ธค 2009 ลากยาวไปจนวันนี้ (2 มค 2010) วันแรกๆ เงินพอมี วงเล็กๆ กินหรู Label ทั้งหลายแหล่มีครบทุกสีเลย (เว้น Blue) แต่พอมาวันที่ 2 สงสัยเหมือนกันทำไมมันเปลี่ยนเป็นแสงโสมได้ ไม่รู้เพราะไร
แต่เอาเหอะครับ กินกันแค่พอสนุก แล้วอย่าลืม เมาไม่ขับ (แล้วจะกลับได้ยังไง) เหล้านี่ก็แปลกนะครับ กินทางปาก แต่เมาที่้เท้า เดินเซไปเซมา อันนี้เป็นปกติของคนกินเหล้า แต่จะมีอีกพวกเวลาไปเที่ยวคือพวก แอลกอฮอลลงไข่ อันนี้จะหาเหยื่อ (หรือตกเป็นเหยื่อก็ไม่รู้) แต่ขอเตือนเพื่อนๆ ที่มาเที่ยวที่เชียงใหม่หน่อยนะ ถ้าไม่อยากหัวแตก ก็ระวังน้องๆ ที่มาจากเกะด้วยล่ะกัน สังเกตุไม่ยาก จะแต่งตัวปิดบนนิด ล่างหน่อย แล้วจะออกปากชวนเราไปต่อเอง หุหุ ลองไปเหอะ หัวแตกแน่นอน … ระวังด้วยล่ะกันครับ ขอให้หื่นอย่างมีสติ… ส่วนอีกพวกเวลาเมาจะเป็นพวกแอลกอฮอลลง teen (แต่ออกทางปาก) พวกนี้เวลาเมาผมจะไม่รู้จักมันเด็ดขาด แม้จะเป็นเพื่อนสนิทกันขนาดไหนก็ตาม ถ้าเมาแล้วรุงรังอันนี้ตัวใครตัวมัน
ออกนอกเรื่องไปซะไกลเชียว … เข้าเรื่องของเราดีกว่า จริงๆ ก็ไม่รู้จะเขียนอะไรหรอก แต่ก็ไม่อยากให้เว๊ปมันร้าง ไม่ได้อัพเืดทอะไรเลย เดี๋ยวพาลจะไม่มีคนเข้ามาอ่านซะเปล่าๆ (จริงๆ ก็ไม่ค่อยมีคนเข้ามาอยู่แล้วแหละ) ช่วงก่อนผมได้ทำการย้ายร่างจากสาวก prototype.js ไปใช้งาน jQuery สักพักหนึ่ง แล้วเริ่มติดใจอย่างถอนตัวไม่ขึ้นเสียแล้ว จริงๆ ก็ไม่อยากย้ายหรอก แต่ด้วยงานที่ต้องทำมันต้องไปแก้เจ้า drupal นี่สิ เลยโดนบังคับทางอ้อมซะงั้น (เว๊ปตัวเองก็ใช้ drupal แต่ไม่เคยคิดจะเขียนอะไรเพิ่มเลยเนอะ)
สำหรับท่านๆ ที่ใช้ javascript framework ไม่ว่าจะตัวไหนก็ตาม ทุกครั้งที่ใช้ ก็ต้องทำการ import เข้าไปใน html ใช่ไหมครับ โดยปกติเราจะเขียนแบบนี้ในส่วนของ head
<script type="text/javascript" language="javascript" src="jquery-1.3.2.js"></script>
ซึ่งมันก็ถูกต้องแหละครับ แต่… ถ้าหากเราได้รับงานมาให้เขียนเพิ่มแค่หน้าเดียว หรือไม่มีสิทธิ์ในการอัพโหลดไฟล์เข้าไป ประมาณว่าต้องส่งไฟล์ให้คนอื่นอัพโหลดอีกที ถ้าหากมีหลายๆ ไฟล์ คนที่อัพโหลดอาจเกิดอาการงงชีวิตได้ เพราะไม่รู้จะไปอัพไว้ที่ไหน หรือต้องอัพไฟล์ไหนบ้าง
ทางออกของเราก็ง่ายมากเลยครับ google ได้เก็บ javascript framework ทั้งหมดไว้แล้ว (จริงๆ เริ่มตั้งแต่ปีที่แล้ว แล้วแหละ) framework ที่ google ได้เก็บไว้มีดังต่อไปนี้
- jQuery กำลังมาแรงมากๆ ในบ้านเรา ลองดูโค๊ดเว๊ปที่มี Effect สวยๆ เหอะครับ มากกว่า 90% มาจาก jQuery ทั้งนั้น
- jQuery UI ใช้คู่กับ jQuery ประมาณผีเน่ากับโลงผุ ไม่มี jQuery ก็ไม่มี UI (แต่ jQuery ทำงานโดยไม่มี UI ได้นะ)
- Prototype อันนี้เมื่อก่อนผมใช้ครับ ออกแนวชอบด้วยแหละ แต่ด้วยความสามารถที่สู้ jQuery ไม่ได้แล้ว ทำให้ต้องย้ายค่าย แต่ถ้าเอาแค่ DOM + AJAX ทำได้เหมือนๆ กันครับ
- script_aculo_us อันนี้เป็น Effect ทั้งหลายของ Prototype คล้ายๆ กับ jQuery UI ที่ต้องคู่กับ jQuery แหละ ความสามารถผมว่าเทียบเท่ากับ UI แต่เรื่อง Coding ยังแพ้อ่ะ (คือเขียนเยอะกว่า)
- MooTools
- Dojo
- SWFObject ตัวนี้ใช้เรียก flash โลดครับ มีประโยชน์มากมาย
- Yahoo! User Interface Library (YUI) น้องยุ้ยของเรา Yahoo ทำเองซะเลย (เอาเวลาไปพัฒนา search engine ดีกว่าไหม) เคยศึกษา แต่ไม่ได้จริงจัง เชียงใหม่เท่าที่รู้มีบริษัทเดียวที่ใช้เป็นหลัก
- Ext Core
- Chrome FrameNew!
จากรายชื่อทั้งหมดก็แทบจะเป็น javascript framework ที่คนทั่วโลกใช้งานกันแล้ว โดยทุกๆ ตัวได้ถูกรวบรวมไปไว้ใน server ของ google เลย ทำให้ไม่ต้องเก็บไฟล์ไว้ใน server ของเราอีกต่อไป ประหยัด bandwidth ไปได้หน่อยนึงซึ่งถ้าหากเว๊ปทั้งโลกมาชี้ที่ google จะประหยัด bandwidth ได้มหาศาลเลย เดี๋ยวค่อยอธิบายกันครับ
วิธีเรียกใช้ก็มี 2 วิธีใหญ่ๆ แต่ผมขอแนะนำวิธีเรียกไปที่ไฟล์ตรงๆ เลยจะง่ายกว่า เพราะไม่ต้องโหลด jsapi ไม่ต้องขอ APIs Key (แต่ถ้าต้องการใช้พวก Maps ก็ต้องขอ Key นะครับ)
วิธีการก็แสนจะง่ายดาย
- jQuery
- http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js
- jQuery UI
- http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js
- ก่อนจะโหลด UI ต้องโหลด jQuery ก่อนนะครับ ไม่งั้นมี error แน่นอน
- Prototype.js
- http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js
- Scriptaculous
- http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculous.js
- ต้องโหลด Prototype ก่อนนะครับ ไม่งั้นมี error แน่นอน
- MooTools
- http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools.js
- Dojo
- http://ajax.googleapis.com/ajax/libs/dojo/1.4.0/dojo/dojo.xd.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/dojo/1.4.0/dojo/dojo.xd.js.uncompressed.js
- SWFObject
- http://ajax.googleapis.com/ajax/libs/yui/2.8.0r4/build/yuiloader/yuiloader-min.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/yui/2.8.0r4/build/yuiloader/yuiloader.js
- Ext Core
- http://ajax.googleapis.com/ajax/libs/ext-core/3.0.0/ext-core.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/ext-core/3.0.0/ext-core-debug.js
- Chrome Frame
- http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.2/CFInstall.min.js (แบบย่อ)
- http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.2/CFInstall.js
อยากเอาอันไหนไปใช้ก็เลือกตามใจชอบได้เลยนะครับ
ทำแบบนี้แล้วมันมีข้อดี ข้อเสียยังไง?
เริ่มจากข้อเสียก่อนเลยเนอะ (ปกติจะเริ่มจากข้อดีนี่)
ผมเห็นมีแค่ข้อเดียวเท่านี่นคือ เราต้องต่อเน็ตทุกครั้งที่เรียกใช้ ซึ่งก็แก้ไขไม่ยาก แค่เปลี่ยน path มาเป็นไฟล์ในเครื่องเราเท่านั้นเอง ยังไงซะ เว๊ปของเราก็ต้อง online อยู่ตลอดเวลาอยู่แล้วนี่
ส่วนข้อดีคือ
ไฟล์อยู่ที่ google ซึ่ง cloud ของ google น่าจะแข็งแรงพอที่จะทำ uptime ได้ 100% แหละครับ คือ เรียกเมื่อไหร่ก็เจอ
ส่วนอีกข้อหนึ่ง อาจจะไม่ค่อยมีคนเห็นความสำคัญเท่าไหร่นักแต่ระบบแคชของ browser จะเก็บไฟล์ไว้ในเครื่องของเราเสมอ และถ้าหากไฟล์นั้นมาจากที่เดียวกัน และไม่เปลี่ยนแปลงมันจะได้ค่า 304 มาจาก server หมายความว่าไฟล์ไม่มีการเปลี่ยนแปลง browser จะไม่โหลดไฟล์นั้นมาจาก server แต่ละโหลดมาจากแคช (cache) ของ browser ซึ่งก็อยู่ในเครื่องเรานี่เอง ถ้าหากทุกเว๊ปไซต์ทำการชี้ไปที่ google ก็หมายความว่าตัว framework จะไม่ถูกดึงมาเลย ถ้าหากเคยเข้าเว๊ปไซต์อื่นที่ทำการชี้ไปที่ google เหมือนกัน เนื่องจากไฟล์อยู่ที่เดียวกัน และไม่มีการเปลี่ยนแปลง
ลองดูจากรูปนี้ก็ได้ครับ ไฟล์ที่ได้ 304 มาหมายถึงไฟล์ไม่มีการเปลี่ยนแปลง จะถูกโหลดมาจากแคชของ browser แทน
ก่อนจากกันก็ลองเปลี่ยนมาใช้ไฟล์ที่ฝากไว้กับ google บ้างก็ดีนะครับ ช่วยลดโลกร้อนและประหยัด bandwidth ไปได้ไม่มากก็น้อย แต่ถ้าวันใด google เกิดเบื่อ ยกเลิกบริการทั้งหมดแล้วปิดตัวเองไป ก็ตัวใครตัวมันล่ะครับ…