ฉันเป็นนักพัฒนามือถือที่ใช้เวลามากมายในการพิจารณาปัญหานี้
คุณถามทำไม?
ส่วนใหญ่คุณหวังว่าจะลดต้นทุนการพัฒนาแอปโดย:
- การใช้ทักษะการพัฒนา HTML5 / Javascript ที่มีอยู่
- การกำหนดเป้าหมายหลายแพลตฟอร์มโดยไม่ต้องเขียนหลายแอพตั้งแต่เริ่มต้น
- ไม่ต้องรักษารหัสหลายฐานในอนาคต
เหตุผลอาจรวมถึง:
- การพัฒนา HTML5 / Javascript นั้นรับรู้ว่า "ง่ายกว่า" กว่าการพัฒนาแพลตฟอร์มดั้งเดิม
- หลีกเลี่ยงการชำระค่าธรรมเนียมการลงทะเบียนโปรแกรมผู้พัฒนา
- หลีกเลี่ยงข้อ จำกัด เนื้อหาของ appstore (การพนันและอื่น ๆ )
- หลีกเลี่ยงการซื้อฮาร์ดแวร์สำหรับการพัฒนา (เช่น Mac สำหรับการพัฒนา iPhone)
คำนิยาม
ลองสร้างสิ่งที่เราหมายถึงโดยวิธีการทั้งสามวิธีที่กล่าวถึง:
เนเชอรัล
แอพที่ติดตั้งบนอุปกรณ์มักจะมาจาก app store (แม้ว่าบางครั้งจะสามารถไซด์โหลด) สำหรับวัตถุประสงค์ของการสนทนานี้ UI ของแอปที่ใช้ในท้องถิ่นมักจะไม่ประกอบด้วยมุมมองเว็บแบบเต็มหน้าจอเท่านั้น
เว็บบนมือถือ
อันที่จริงแล้วอาจเป็นหน้าเว็บใด ๆ เลยอย่างไรก็ตามสำหรับการสนทนานี้ลองพิจารณาแอพพลิเคชั่นเว็บหน้าเดียวที่พยายามเลียนแบบรูปลักษณ์ของแอพแบบดั้งเดิม มันไม่ใช่แอพเนทีฟแอพมันทำงานในเบราว์เซอร์ของอุปกรณ์
ไฮบริด
ของแอปไฮบริดinstanceofapp พื้นเมือง
คนส่วนใหญ่อาจจะเข้าใจแอพไฮบริดว่าเป็นแอพมือถือหน้าเว็บเดียว (มักจะเลียนแบบรูปลักษณ์ของแอพเนทีฟ) แต่บรรจุเป็นแอปเนทีฟที่เข้าถึงบริการเนทีฟ (à la Phonegap)
อย่างไรก็ตามในความเป็นจริงแล้วมีสเปกตรัมระหว่างรุ่น Phonegap และแบบดั้งเดิมซึ่งฉันจะมาในภายหลัง
เว็บมือถือ
ข้อ จำกัด ทางเทคนิคก่อนอื่น
ให้เราแสดงรายการข้อ จำกัด ทางเทคนิคบางประการเกี่ยวกับแอพพลิเคชั่นเว็บมือถือซึ่งอาจเป็นตัวแบ่งข้อตกลงขึ้นอยู่กับสิ่งที่คุณทำ:
- HTML / Canvas UI เท่านั้น
- ไม่มีการเข้าถึงกิจกรรมและบริการของอุปกรณ์บางอย่าง
- ไม่สามารถแสดงในร้านค้าแอป (ส่งผลกระทบต่อการค้นพบ)
- สามารถเป็นแบบเต็มหน้าจอและมีไอคอนหน้าจอหลักบน iOS อย่างไรก็ตามนี่เป็นประสบการณ์ที่แปลกและไม่คุ้นเคยสำหรับผู้ใช้ส่วนใหญ่
หากคุณสามารถใช้ชีวิตกับทุกสิ่งข้างต้นให้อ่านเพิ่มเติมเกี่ยวกับความท้าทายของแอพพลิเคชั่นเว็บแบบเนทีฟแบบหน้าเดียว อย่างไรก็ตามส่วนนี้จะไม่สมบูรณ์หากไม่มีการอ้างอิงแอป FT
Financial Times FT เว็บแอปเป็นตัวอย่างที่มีชื่อเสียงของรูปแบบของการตรวจสอบนี้ นี่คือคุณลักษณะที่น่าสนใจจากหนังสือพิมพ์ UK Guardian เกี่ยวกับเรื่องนี้
แน่นอนว่ามันเป็นผลงานทางวิศวกรรมที่โดดเด่น โปรดทราบว่าขณะนี้ยังคงให้บริการเฉพาะในiOS เท่านั้น - สิ่งนี้บอกฉันว่าพวกเขากำลังพบว่าการแก้ไขความท้าทายของการพัฒนาข้ามเบราว์เซอร์ขั้นสูงนั้นเป็นเรื่องยากมาก
แอปพลิเคชันเว็บแบบเนทีฟแบบหน้าเดียว
ส่วนนี้ใช้กับทั้งมือถือและแอพพลิเคชั่นสไตล์ Phonegap
รูปลักษณ์และความรู้สึกแบบเนทีฟภายในเว็บแอปมักจะประสบความสำเร็จด้วยกรอบงานเช่นSencha Touchซึ่งมีชุดส่วนประกอบ UI สำหรับให้คุณใช้
กรอบดังกล่าวดีสำหรับ UIs ที่ง่ายมาก อย่างไรก็ตามพวกเขาขาดความยืดหยุ่น คุณจะไม่สามารถใช้การออกแบบแอพแบบดั้งเดิมโดยใช้ Sencha คุณจะต้องปรับการออกแบบของคุณให้เข้ากับกรอบที่สามารถรองรับได้
วิธีหลักที่เฟรมเวิร์กเหล่านี้ประสบคือพยายามเลียนแบบความซับซ้อนของ UI ของแพลตฟอร์ม เอฟเฟกต์กระดอนเล็ก ๆ น้อย ๆ ที่สวยงามที่คุณได้รับเมื่อคุณเลื่อนไปที่ส่วนท้ายของรายการบน iPhone หรือไม่ กรอบงานของคุณต้องจำลองใน Javascript เป็นไปไม่ได้ที่จะสร้างใหม่อย่างสมบูรณ์มันจะมีแนวโน้มที่จะชะลอตัวลงและผู้ใช้ของคุณจะติดอยู่ใน "หุบเขาลึกลับ" ของแอพที่มีลักษณะเหมือนคนพื้นเมือง แต่ไม่ชัดเจนและไม่ใช่ด้านเทคนิค ผู้ใช้จะไม่สามารถวางนิ้วบนทำไม
ตำนาน "HTML5 / Javascript นั้นง่าย"
การกระจายตัวของอุปกรณ์ภายในเว็บเบราว์เซอร์นั้นมีมากมายและเมื่อคุณได้รับมากกว่า HTML และ CSS พื้นฐานที่สุดคุณจะสังเกตได้ว่าสิ่งต่าง ๆ ไม่ได้ผลอย่างที่คุณคาดหวัง คุณอาจพบว่าตัวเองใช้เวลามากขึ้นในการแก้ปัญหา UI ที่เล่น ๆ มากกว่าที่คุณบันทึกไว้ หากคุณเป็นเจ้าของภาษาโปรดทราบว่า webviews ของแอปพลิเคชันดั้งเดิมนั้นไม่เหมือนกับเบราว์เซอร์อุปกรณ์และมีปัญหาการกระจายตัวของมันเอง
และเมื่อแอพของคุณมีความซับซ้อนในการใช้งานมากขึ้นคุณจะพบว่าคุณต้องมีทักษะ jquery พื้นฐานเพื่อให้ Javascript ของคุณสะอาดและบำรุงรักษา
ที่กล่าวมาเป็นไปได้อย่างสมบูรณ์ในการสร้างแอพที่ใช้งานง่ายและใช้งานได้อย่างรวดเร็วด้วยวิธีการนี้ แต่มันก็ค่อนข้างชัดเจนเมื่อแอพกำลังทำอยู่
ไกลออกไปตามสเปกตรัม
ดังนั้นเราต้องการ UX ที่ดีกว่าแอพ Phonegap สไตล์ที่สามารถให้ได้โดยไม่ต้องเขียนทุกอย่างตั้งแต่เริ่มต้นหลายครั้ง อะไรที่พวกเราสามารถทำได้?
แบ่งปันรหัสที่ไม่ใช่ UI
มีเทคนิคหลากหลายสำหรับการแบ่งปันตรรกะทางธุรกิจข้ามแพลตฟอร์มที่มีอยู่หลายตัว Google ได้เปิดตัวJ2ObjCซึ่งแปล Java เป็น Objective-C ด้วยการใช้รหัสอย่างระมัดระวังทำให้สามารถใช้ไลบรารี Java บนทั้ง Android และ iOS
ไลบรารี่เช่นCalatravaและKirinอนุญาตให้เขียนโค้ดเบสใน Javascript (และดังนั้นสิ่งใดก็ตามที่สามารถคอมไพล์ไปยัง Javascript) ได้รับการจัดการจากโค้ดเนทีฟ คำเตือน: ฉันทำงานให้กับแพลตฟอร์มในอนาคตที่สร้างคิริน; เราประสบความสำเร็จอย่างมากในการใช้งานบน iOS ด้วย Javascript ที่สร้างจาก Java ด้วย GWT โดยที่โค้ด Java ยังทำงานบน Android
ใช้ webviews ... ตามความเหมาะสม
webviews เต็มหน้าจอมีงานจำนวนมากที่ต้องทำเพื่อให้สามารถเลียนแบบการเปลี่ยนหน้าจอและเอฟเฟกต์การตีกลับ แต่มุมมองทางเว็บภายใน Chrome แอปในเครื่องสามารถแยกแยะได้จาก Native
มีวิธีการที่เป็นมาตรฐานและมีเอกสารที่ดีสำหรับแอพและการดูเว็บออนไลน์เพื่อสื่อสาร
รายการและตารางสามารถทำงานได้ดีโดยเฉพาะอย่างยิ่งเมื่อทำในลักษณะนี้อย่างไรก็ตามการป้อนข้อความเป็นตัวอย่างของสิ่งที่จัดการได้ดีที่สุด (สำหรับการควบคุมแป้นพิมพ์แบบเต็ม)
สรุป
วิธีการที่เหมาะสมสำหรับคุณขึ้นอยู่กับความซับซ้อนของแอพของคุณและ UI ระดับใดที่คุณพึงพอใจ
คำขวัญของฉัน: ใช้ webviews ทุกที่ที่คุณทำได้ แต่ให้แน่ใจว่าผู้ใช้ของคุณไม่สามารถบอกได้
