Code Fest - Работает? Стабильно? Эффективно?

Transcript

1. Работает? Стабильно? Эффективно? Михаил Давыдов, Яндекс
2. Error on line 1 column 57841. Ololo is not defined…
3. Воспроизводится! В норм. браузере!
4. 4 Эта проблема легко решается • Это уже воспроизвелось! • Reformat Code • SourceMap
5. 5 Reformat Code
6. 6 SourceMap • Сопоставляет код коду • UglifyJS • Chromium browser • CoffeeScript, TypeScript, JS Статья - http://clck.ru/8bjOI Визуализатор - http://clck.ru/8bjOQ
7. 7 Воспроизводится! Только в IE < 8 L
8. 8 Дебаг IE – это весело! • Любимые ошибки – Unexpected call to method or property access – Error: 'z' is null or not an object
9. 9 И эта проблема легко решается • Это уже воспроизвелось! • console.log – не поможет… • F12 – не поможет… • Visual Studio Express – FTW!
10. 10 Visual Studio Express for Web Как дебажить - http://clck.ru/8bjPG
11. Ошибка нигде не воспроизводится…
12. 12 И проблема решается • Связаться с пользователем • Попросить описать шаги • Скриншоты • Информация о браузере
13. Отслеживание ошибок
14. 14 Отслеживаем ошибки • Собираем все данные • Хорошая форма репорта • Отлов ошибок в фоне
15. 15 Собираем все данные • User Agent • OS • Список все плагинов
16. 16 Хорошая форма репорта • Все данные браузера • Скриншот • Пошаговое воспроизведение
17. 17 Распространённые формы репорта • User Voice • Get Satisfaction • UserEchо
18. 18 Отлов ошибок в фоне • Ловим –  window.onerror + jQuery.error • Интерпретируем –  библиотека stacktracejs • Отправляем –  Google Analytics –  Яндекс.Метрика http://stacktracejs.com/
19. 19 Отлов ошибок в фоне • Raven.js –  Клиент для Sentry –  window.onerror = Raven.process; –  Open-Source https://github.com/getsentry/raven-js
20. 20 Сервисы для отлова ошибок • Qbaka • Proxino • Errorception
21. Предотвращение ошибок, как?
22. 22 Как предотвратить • Хороший IDE –  Ловит 95% проблем • Статический анализ –  Автоматический! –  JSLint –  JSHint • Тестирование http://www.jshint.com/ Хороший IDE – http://clck.ru/8bosY
23. Код долго загружается
24. 24 Как оптимизировать • Вынести максимум в CDN • Найти холодный код • Найти мертвый код • Сделать ленивую загрузку
25. 25 Вынести максимум в CDN • http://yandex.st/ • http://cdnjs.com/ • Google – http://clck.ru/8bjZK • Держать запасную библиотеку!
26. 26 Найти холодный и мертвый код • Аналитически –  Своим умом –  С помощью IDE • Счетчики для "фичей" –  Google Analytics –  Яндекс.Метрика • Code Coverage
27. 27 Счетчики для "фичей" • Это дешево –  Сервисы аналитики есть везде • Нужно вешать счетчики • Отчет слишком общий
28. 28 Статистический Code Coverage • СС – не только для тестов • Пользователь – лучший тестер • Дешево и надежно • Можно управлять покрытием • Мониторится все
29. 29 Статистический Code Coverage https://github.com/azproduction/lmd
30. 30 Косвенная прибыль Code Coverage • Знаем что не интересно • Знаем горячие фичи
31. Загружаем лениво
32. 32 Как использовать • Выделяем холодный код • Делим код на модули • Загружаем по требованию
33. 33 Библиотеки для ленивой загрузки • RequireJS + r.js • LABjs, YepNope, Headjs • LMD
34. Деградация проекта. Как не допустить?
35. 35 Деградация происходит из-за • Не соблюдается Code Style • Децентрализация • Отсутствие документации
36. 36 Способы предотвращения деградации • Единый Code Style • Коммит через Code Review • Проверка кода c JSHint • Автотесты • Плановые рефакторинги
37. Что нужно пользователю?
38. 38 Что нужно пользователю • Стабильная работа • Быстрая загрузка • "Прикольные фичи!!11"
39. 39 Как узнать какие фичи нужны/не нужны?
40. 40 Что нужно пользователю • Опросники • Счетчики • Code Coverage • Анализ конкурентов
41. 41 Холодная фича – не нужная фича?
42. 42 Проблемы Холодной фичи • Не знают о ней • Не могут найти • Не удобная/не привыкли • Не нужна
43. Оптимизируем затраты
44. 44 На что нужно обратить внимание • Максимум автоматизации –  Отлов ошибок –  Хороший IDE –  Статический анализ кода с JSHint • Не пишем лишнее –  Формы с обсуждением фичей –  Взвешиваем каждую фичу –  Code Coverage для анализа кода
45. Михаил Давыдов Яндекс i@azproduction.ru azproduction Спасибо