Sử dụng Phonegap để phát triển Ứng dụng gốc [đã đóng]

Gần đây tôi đã xem qua Phonegap . Có ai trong số bạn đã thử nó. Nó là một công cụ đáng kinh ngạc tuyên bố rằng các nhà phát triển có thể sử dụng khuôn khổ dựa trên HTML 5 như Sencha touch và Jquery cùng lúc có quyền truy cập vào các tính năng gốc trên điện thoại. Ngoài ra, mã được di động từ Android sang Iphone với một số nỗ lực. Trước khi bắt tay vào làm, tôi muốn biết trải nghiệm của diễn đàn với Phonegap là gì. Những điểm khó khăn là gì và nó có thực sự có thể mở rộng để phát triển ứng dụng cấp doanh nghiệp hay không.

Tôi đã xây dựng một vài ứng dụng bằng PhoneGap và đối với những gì nó cung cấp, điều đó thật tuyệt. Có một số lưu ý nhanh mà tôi muốn chỉ ra, có thể giúp ích cho bạn.

Disable device-based features you're not using Các tính năng gia tốc kế, định vị được bật theo mặc định. Nếu bạn không sử dụng chúng, tôi sẽ tắt chúng đi, vì ứng dụng của bạn sẽ tải nhanh hơn (khởi tạo) và chạy mượt mà hơn.

onDeviceReady- Đây là phương thức được gọi khi phonegap đã tải và sẵn sàng. $ (document) .ready hoặc bất cứ thứ gì bạn đã quen, không thực sự áp dụng ở đây - trừ khi bạn chỉ làm giao diện / nội dung HTML được mã hóa cứng. Nếu bạn đang tương tác với các tính năng của iPhone, chẳng hạn như GeoLocation, bạn sẽ cần thực hiện mọi thứ sau khi onDeviceReady được gọi.

Pick a UI/library Có rất nhiều tùy chọn cho giao diện / thư viện, jquery-mobile, sencha touch, jqtouch, v.v. Mỗi tùy chọn này đều cung cấp một cách tiếp cận độc đáo và bộ tính năng. Thực hiện một số nghiên cứu và sử dụng một, nhưng tránh kết hợp. Bạn có thể đọc thêm một số tùy chọn, công cụ tại đây: http://www.phonegap.com/tool (link cập nhật)

Also, more on just mobile development in general, with PhoneGapNếu bạn đang tìm cách xây dựng các ứng dụng, được phân phối thông qua Android market và iPhone App Store, tôi sẽ đọc qua danh sách đầy đủ của họ để biết hướng dẫn về cách phát triển ứng dụng của bạn. Ví dụ: trong liên kết công cụ ở trên, có một "công cụ / plugin" được gọi là Easy APNS - trong khi điều này hữu ích cho Android - và có thể thực hiện được về mặt kỹ thuật trên iPhone, nó vi phạm thỏa thuận phát triển, vì nó nói rằng bạn phải sử dụng thông báo của Apple mạng, v.v. Đây chỉ là một ví dụ, nhưng đọc những thứ đó sẽ giúp bạn đỡ đau đầu hơn, nếu đó là mục tiêu cuối cùng của bạn.

Nói chung, nó rất tốt cho các ứng dụng nhẹ, đặc biệt nếu bạn đến từ nền tảng phát triển web. LocalStorage, GeoLocation, v.v. hoạt động rất tốt. Tôi hy vọng điều này sẽ giúp một chút ... và cảm thấy để đặt câu hỏi.

Chỉnh sửa bổ sung:

Tôi thực sự nghĩ rằng nó phụ thuộc vào những gì bạn muốn làm và những gì bạn biết cách làm. Matt chỉ ra rằng phát triển các ứng dụng gốc dành cho iOS thì tốt hơn, v.v. Vâng, nếu bạn có thời gian và kiến ​​thức để tìm hiểu điều đó - tất nhiên bản địa sẽ tốt hơn. Nhưng PhoneGap được tạo cho các nhà phát triển web có thể sử dụng bộ kỹ năng hiện có của họ và xây dựng ứng dụng. Ngoài ra, PhoneGap cho phép bạn xây dựng ứng dụng nhanh chóng, dành cho iOS, Android, Symbian, Palm, Blackberry. Với những điều chỉnh nhỏ đối với cơ sở mã của bạn cho mỗi.

Dưới đây là tất cả các hướng dẫn về Hiệu suất tốt nhất mà tôi đã đọc cho PhoneGap ... có rất nhiều điều cần cảnh giác để đảm bảo bạn có hiệu suất ổn định, vững chắc ... nhưng bạn có thể thu thập tất cả chỉ trong một buổi tối đọc.

Dưới đây là những loại cốm tốt nhất:

PhoneGap / Mẹo Hiệu suất Web Di động

• Cách Diary.com tăng hiệu suất của ứng dụng PhoneGap chạy Sencha: http://www.phonegap.com/2011/06/21/building-the-diary-com-ios-app-using-pg-sencha-touch/
• http://floatlearning.com/2011/03/developing-better-phonegap-apps/
• http://jslint.com/ - để gỡ lỗi javascript của bạn
• http://zeptojs.com/ và http://xuijs.com/ - các khung thay thế tối thiểu cho jquery và jqtouch
• Tắt gia tốc kế và vị trí http://blogs.nitobi.com/jesse/2009/10/28/running-jqtouch-in-phonegap/
  • đặt “EnableAcceleration” thành false trong PhoneGap.plist
  • đặt "AutoRotate" thành false trong PhoneGap.plist
• http://mir.aculo.us/2010/06/04/making-an-ipad-html5-app-making-it-really-fast/
• http://cubiq.org/remove-onclick-delay-on-webkit-for-iphone
• Demo: http://cubiq.org/dropbox/clickdelay.html
• FastClick v TouchStart: http://groups.google.com/group/phonegap/browse_thread/thread/f5f5c78e26513821?pli=1

• http://forum.jquery.com/topic/ontouch-instead-of-onclick-event

• http://wiki.phonegap.com/w/page/16494809/Performance-tips-for-device/

• http://www.developer.nokia.com/Community/Wiki/JavaScript_Performance_Best_Practices
• http://evolvewe.com/building-an-iphone-app-part-3-7-dev-tips/
• http://evolvewe.com/upgrading-to-phonegap1-0/

• VIDEO Mẹo Hiệu suất cho Sencha Touch: http://vimeo.com/17882927

  • Nó bao gồm các tính năng hiệu suất trong Sencha, đây là những nguyên tắc tuyệt vời mà chúng tôi có thể áp dụng lại. Chúng tôi thậm chí có thể cắt mã từ một số mảnh Sencha nhất định để đăng ký lại cho Skej.
  • Nó nói rằng chúng ta PHẢI phá hủy bất cứ thứ gì không hiển thị trên DOM. Và rằng DOM phải luôn được giữ ở mức nhỏ nhất có thể, với càng ít người nghe càng tốt. (Tức là đính kèm một trình nghe vào mục mẹ của danh sách, thay vì đính kèm từng mục danh sách.)
  • Nó cũng có các mẹo CSS3 thực tế để tôi áp dụng ... Về cơ bản, không sử dụng nhiều hiệu ứng chuyển tiếp và bóng / góc tròn mới vì hiện tại đang sử dụng CPU chứ chưa phải GPU.

• Ủy quyền sự kiện trong Sencha Touch: Cách thiết kế danh sách với một người nghe duy nhất chứ không phải một người nghe trên mọi dòng. http://www.sencha.com/blog/event-delegation-in-sencha-touch/

• Tối ưu hóa việc sử dụng bộ nhớ DOM trong Sencha Touch: Trượt từ Danh sách sang bảng Chi tiết và hủy danh sách, sau đó trượt từ Chi tiết sang Danh sách và tắt bảng chi tiết. Giảm thiểu các yếu tố trên màn hình, DOM của bạn. http://www.sencha.com/blog/sencha-touch-optimizing-memory-usage/
• DESTRO BẤT KỲ ĐIỀU GÌ KHÔNG CÓ TRÊN DOM CỦA BẠN!
• Sử dụng CSS Animations thay vì jQuery
• http://nyroo.com/l/B7UN5c
• http://www.ferretarmy.com/css-animation-examples/
  • Hãy cẩn thận ... những điều này rất phức tạp khi chúng không tận dụng GPU và làm hỏng CPU.

Bật các chức năng mới

• Bật Màn hình Retina: http://evolvingwe.com/create-retina-display-images-in-mobile-web-themes-and-phonegap-apps/
• Vuốt để xóa: http://www.codesta.com/blog/2011/5/23/sencha-touchphonegap-tips-and-tricks.html
• Tắt gia tốc kế và vị trí: http://iamcam.wordpress.com/2009/10/29/phonegap-up-to-speed/
• Cắt jQuery và Mã tay: http://cubiq.org/do-you-really-need-jquery-for-mobile-dev
• Hiển thị Danh sách Liên hệ trong Mobile Safari: http://cubiq.org/contact-list-on-webkit-for-iphone
• iScroll4: Tạo tiêu đề, cuộn trong một div có kích thước cố định, chụm và thu phóng, kéo lên / xuống làm mới. http://cubiq.org/iscroll-4 (Bao gồm các mẹo về hiệu ứng dây chun.)
• Repo GitHub của PhoneGap: Bao gồm các ví dụ thú vị như DatePicker, SMSComposer, ApplicationPreferences, Splashscreen, NetworkActivityIndicator ... https://github.com/phonegap/phonegap-plugins

Ngành kiến ​​trúc

Kiến trúc ứng dụng của bạn trong Ext JS 4: http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-2

Trước khi bày tỏ quan điểm của mình về Phonegap, tôi cần đưa ra một tuyên bố từ chối trách nhiệm nhỏ rằng tôi hoàn toàn không phải là một nhà phát triển web. Đối với tôi, viết JavaScript và CSS giống như việc nhổ răng. Điều đó nói rằng, tôi không thích Phonegap.

Có một số khía cạnh rất hấp dẫn của khuôn khổ, chủ yếu là lời kêu gọi "Viết-Một lần-Chạy-Bất-kỳ-được-nào" và "Tôi-Không-Phải-Học-Mục-tiêu-C?" lời kêu gọi. Khung công tác thậm chí có thể cung cấp cho bạn quyền truy cập vào một số tính năng phần cứng như gia tốc kế. Tất cả những điều này đều có giá trị, ở một mức độ nhất định.

Điều đó nói rằng, không có ứng dụng iOS tuyệt vời nào được xây dựng bằng bất kỳ loại khung nền tảng chéo nào. Có rất nhiều tương tác giao diện người dùng tinh tế và thanh lịch được xử lý cho bạn bằng các điều khiển UIKit gốc mà nhiều người dùng và nhà phát triển coi đó là điều hiển nhiên cho đến khi họ bị thiếu, chẳng hạn như một loạt các đường cong hoạt ảnh chế độ xem cực kỳ chi tiết và cuộn trang không có ở đó trong giao diện người dùng dựa trên chế độ xem web. Bạn có thể vất vả để tái tạo chúng một cách hoàn hảo, nhưng đối với việc đầu tư thời gian đó, tại sao không chỉ sử dụng bản gốc?

Một điểm thứ hai cần lưu ý là cộng đồng hỗ trợ cho các ứng dụng iOS do Phonegap xây dựng nhỏ hơn đáng kể so với các ứng dụng được phát triển tự nhiên. Nếu bạn là người dựa vào cộng đồng trong các dự án, điều này cũng sẽ khiến bạn tạm dừng.

Cuối cùng, nó phụ thuộc vào chất lượng trải nghiệm mà bạn muốn mang lại. Giới hạn trên thấp hơn với Phonegap. Nếu bạn sẵn sàng chấp nhận trải nghiệm người dùng kém xuất sắc để đổi lấy thời gian phát triển giảm và tính di động tăng lên, thì đó là một khuôn khổ rất khả thi.

Như ẩn ý cho bất kỳ ai quan tâm, Marco Arment và Dan Benjamin gần đây đã thảo luận về chủ đề này. Bạn có thể nghe nó ở đây .

Quy trình cài đặt liên quan đến một số gói (Java, Apache Ant, Ruby, iOS SDK, Android SDK và PhoneGap chính nó), tất cả đều phải được cài đặt và thiết lập chính xác. Đây có thể là một nỗ lực lớn. Công bằng mà nói, họ có một thứ gọi là PhoneGap Build trong phiên bản beta sẽ giúp việc này dễ dàng hơn nhiều.

Chúng tôi sử dụng nó với NS Basic / App Studio để sản xuất các ứng dụng đủ điều kiện cho các cửa hàng ứng dụng.

nếu bạn không tạo một trò chơi hay một widget, chỉ là một ứng dụng đẹp mắt thì phonegap là lựa chọn của bạn.

Nhưng bạn nên cẩn thận với JS của mình, tránh làm bất kỳ điều gì trong JS, ví dụ như nếu bạn muốn thực hiện bất kỳ hoạt ảnh nào, tránh đặt bộ đếm thời gian với khoảng thời gian nhỏ (ví dụ: 100 mili giây), tránh các hoạt ảnh jquery và giống nhau. Ví dụ: thay vì làm mờ hoạt ảnh bằng cách đặt bộ hẹn giờ trong khoảng thời gian ngắn giảm độ mờ tại từng điểm từng bước (đây là cách làm việc của jquery fade hoạt động), bạn nên sử dụng chuyển tiếp css3 từ độ mờ 1 sang độ mờ 0.

Lời khuyên của tôi là đi với một cái gì đó như zeptojs.com, sau khi tất cả phonegap sẽ không chạy ie6 :-)

Xem một số hướng dẫn về cách làm cho JS của bạn nhẹ hơn

http://bcksp.blogspot.com/

Nếu bạn không cần bất kỳ tính năng hoặc hiệu suất phần cứng nào ngoài những gì HTML5 và Phonegap cung cấp, một ứng dụng web đóng gói (cộng với một số quyền truy cập hạn chế vào các tính năng khác) là một giải pháp tuyệt vời.

Nhiều doanh nghiệp triển khai ứng dụng web quy mô lớn. Phonegap (hoặc chỉ là một điều khiển chế độ xem web đơn thuần với nội dung được nhúng) sẽ cho phép bạn chạy các ứng dụng web này ngoại tuyến (tất nhiên là ngoại trừ bất kỳ dữ liệu trực tuyến nào được yêu cầu).

Một "nỗi đau" không được đề cập khi triển khai giữa một số thiết bị khác nhau: Càng nhiều thiết bị, đường cong học tập càng lớn. Để triển khai tới các thiết bị iOS với PhoneGap, bạn sẽ cần tìm hiểu những kiến ​​thức cơ bản về Xcode trên máy Mac. Để triển khai cho Android, bạn sẽ cần cài đặt và tìm hiểu Eclipse, Android SDK, v.v. Các nền tảng khác yêu cầu sử dụng SDK riêng của chúng. Học một số Xcode, Javascript và Java thô sơ giúp tôi hiểu các lỗi và cú pháp chung.

"Tạo một lần, triển khai mọi nơi" để lại RẤT NHIỀU bước!