В последнее время я больше думал о том, как сделать приложения PhoneGap более надежными. Надежно, я не обязательно говорю о производительности. Хотя это важно (см. Отличный пост в блоге моего коллеги на тему « Производительность и вопросы UX для успешных приложений PhoneGap» ), я больше думаю об общей стабильности приложения в целом. Это особенно важно для приложений, которым нужны или требуются данные, доступные только в сети. То, как вы обрабатываете условия сети, так же важно, как то, как вы обрабатываете UX и производительность вашего приложения. (Ну, это может быть предметом обсуждения. 🙂 В этом сообщении я собираюсь поделиться некоторыми мыслями и примерами того, что я имею в виду под этим, и — как всегда — с нетерпением жду ваших комментариев, предложений и исправлений.
Использование PhoneGap в сети
Может показаться глупым указывать приложения PhoneGap «Net-Using», но для ясности вы вполне можете создать приложение PhoneGap, которое не требует никаких ресурсов из Интернета. Все ваши HTML, CSS и JavaScript могут быть упакованы вместе с приложением, и если у вас нет реальной необходимости использовать удаленные источники, не делайте этого! Если вы привыкли загружать CDN-версию библиотек JavaScript или CSS, замените их локальными копиями.
При этом, если вам нужно использовать Интернет в вашем приложении, как вы можете справиться с проблемами сети? PhoneGap предоставляет два разных способа справиться с этим.
Во-первых, это API-интерфейс подключения . На самом деле это не «API», а просто константа, которую вы можете проверить в своем коде, чтобы определить состояние соединения. Существуют различные результаты, которые позволяют вам проверять не только какое- либо соединение, но и относительную силу соединения. Это может быть полезно, например, для определения того, какое качество видео YouTube вы хотите отобразить — стандартное или HD.
Вот возможные значения для этой константы:
- Connection.UNKNOWN
- Connection.ETHERNET
- Connection.WIFI
- Connection.CELL_2G
- Connection.CELL_3G
- Connection.CELL_4G
- Connection.NONE
Одним из постоянных значений для объекта Connection является UNKNOWN. Как вы справляетесь с этим действительно зависит от вас. В общем, я думаю, что безопаснее быть пессимистичным и предполагать, что UNKNOWN — это то же самое, что и OFFLINE, но я об этом и говорю.
Второе, что предлагает PhoneGap, — это система событий, которая может распознавать изменения в сети. У вас есть как оффлайн, так и онлайн событие, которое ваш код может слушать.
В общем, я думаю, что для приложения имеет смысл проверять состояние сети при запуске и иметь прослушиватели событий для изменений. Вы не можете предполагать, что сетевое соединение, которое существует, когда приложение запускается, будет там до тех пор, пока приложение живо.
Чтобы проверить это, я создаю приложение, которое поддерживает поиск в Твиттере. Если вы находитесь в сети, вы можете ввести поисковый запрос, нажать кнопку и просмотреть результаты в API Twitter. Если вы не в сети, приложение ответит правильно. Код, который я использовал, также обрабатывает ваше устройство в автономном режиме. Вот часть кода.
document.addEventListener("deviceready", init, false);
function init() {
document.addEventListener("online", toggleCon, false);
document.addEventListener("offline", toggleCon, false);
if(navigator.network.connection.type == Connection.NONE) {
navigator.notification.alert("Sorry, you are offline.", function() {}, "Offline!");
} else {
setupButtonHandler();
}
}
function toggleCon(e) {
console.log("Called",e.type);
if(e.type == "offline") {
$("#searchBtn").off("touchstart").attr("disabled","disabled");
navigator.notification.alert("Sorry, you are offline.", function() {}, "Offline!");
} else {
$("#searchBtn").removeAttr("disabled");
navigator.notification.alert("Woot, you are back online.", function() {}, "Online!");
setupButtonHandler();
}
}
По большей части, это должно просто «иметь смысл», но обязательно дайте мне знать, если у вас есть вопросы. (Я включил все приложение в виде почтового индекса, прикрепленного к этой записи в блоге. Это действительно не намного больше, чем это, но если вы хотите увидеть это, просто загрузите кусочки.)
Вот пример приложения, запущенного в Ripple. Обратите внимание, что я уже сделал поиск.
Теперь я могу использовать Ripple для отключения устройства. Обратите внимание, что Ripple подделывает уведомление в устройстве с простым HTML-элементом, наложенным на устройство.
Это может быть немного трудно увидеть, но кнопка также была отключена. Таким образом, пользователь не может случайно щелкнуть его снова. Когда доступ к сети будет восстановлен, кнопка будет снова включена.
Обработка ошибок
Вот кое-что, что я действительно сделал плохую работу. Многие из API PhoneGap и большинство удаленных API имеют некоторый способ обработки ошибок. Но я бы поспорил, что большинство ваших обработчиков ошибок выглядят примерно так.
function errHandler(e) {
console.dir(e);
alert("Sorry, an error. It happened. Deal with it.");
}
На мгновение проигнорировав, что сообщение немного грубовато, обратите внимание, что не было предпринято никакой попытки диагностировать форму ошибки и принять логическое решение относительно того, что следует сделать. Не каждая ошибка — исключение «Подними руки вверх и сдавайся». Во многих случаях это может быть что-то временное, и вы должны предложить своему пользователю повторить попытку. В других случаях это может быть так плохо, что вы захотите закрыть приложение. Главное, что я хотел бы, чтобы вы извлекли из этого, — это рассмотрите типы ошибок, которые вы можете обрабатывать, и постарайтесь реагировать на них как можно лучше. Если у вас возникла странная, тупая ошибка в приложении ранее, и вы хотели ее убрать, имейте в виду, что вы разработчик. Представьте, что думают нормальные люди.
Помните, что JavaScript имеет полную обработку исключений с поддержкой try / catch , возможность генерировать ваши собственные исключения, а также прослушивать ошибки на уровне окна .
Наконец, не забудьте, что вы можете Lint / JSHint свой код. Для людей, плохо знакомых с JavaScript, это может быть немного пугающим, но если вы придерживаетесь мнения, что вам не обязательно соглашаться со всем, что говорит Линт / Хинт, тогда этот опыт не такой уж неприятный. Конечно, если вы используете Brackets, вы получаете встроенный JSLint. (Вы также можете найти расширение для JSHint .)
Отслеживание / сообщение о проблемах
Итак, вот интересный. Представьте, что ваше приложение использует API-интерфейс CowBell. У вас есть хорошая обработка ошибок / обработка соединений на месте. Вы сделали опыт большим для конечного пользователя. Но вы реагируете на эти ошибки и события? Вы знаете, как часто API CowBell отключается? Может быть, это не так плохо. Может быть, это довольно дерьмо. Но пока вы не начнете получать кучу 1-звездочных обзоров, вы не обязательно узнаете об этом.
Может быть, это не так уж плохо. Например, только 10% вызовов терпят неудачу. Это не страшно, но, вероятно, этого достаточно, чтобы оправдать изучение кэширования на стороне приложения. Вы можете использовать LocalStorage или API хранилища . Черт возьми, вы можете использовать файловую систему тоже. С другой стороны, если ваш API имеет что-то вроде 100% безотказной работы и ваши пользователи находятся в области с чертовски хорошим охватом, возможно, вам не стоит беспокоиться об этом.
Дело в том — откуда ты знаешь?
Во время внутреннего тестирования вы можете использовать простой код, который записывает в локальный файл. Вы можете добавить временную кнопку для загрузки этого файла на центральный сервер. Пока ваши пользователи проводят тестирование, они могут использовать эту кнопку для загрузки своих локальных журналов, когда что-то происходит.
Конечно, вы можете сделать то же самое и с выпущенным производственным приложением. То, сколько вы отслеживаете и как вы загружаете, является скорее этическим вопросом, чем техническим, но этот вариант также существует.
Вы можете использовать стороннее решение для обработки ошибок JavaScript, например {errorception} . Однако — я не знаю, поддерживают ли они приложения PhoneGap. Когда я узнаю, я буду редактировать этот пост. Я нашел их результаты невероятно подробными и полезными для моих настольных приложений.
Что еще?
Так что я знаю, что мне не хватает других предложений. Оставьте комментарий ниже!