Скачать презентацию
Идет загрузка презентации. Пожалуйста, подождите
Презентация была опубликована 10 лет назад пользователемАлина Тартаковская
1 Применение BackboneJS для рефакторинга фронтенда веб- приложения Алексей Авдеев Нижний Новгород, Go-Promo, go-promo.ru
2 Как бывает
3 Описание проблемы Проект растёт Количество кода увеличивается Файл application.js разрастается Внесение изменений становится опасным Общая область видимости переменных Конфликты при работе в команде
4 Первая попытка application.js application.gallery.jsapplication.messages.jsapplication.comments.js
5 Пример
6 Преимущества Меньше кода в каждом файле Меньше конфликтов при работе в команде Зачатки модульности Стало понятнее, куда писать какой код
7 Недостатки первой попытки Название файла – лишь рекомендация Глобальная область видимости осталась Появились проблемы с зависимостями Каша в ресурсах лишь увеличилась
8 Вторая попытка
9 Используем плагин
10 Преимущества jQuery-плагины хорошо изолированы Модульность. Плагин можно легко перенести в другой проект. Появились зачатки структуры кода в представлении (методы, состояния)
11 Недостатки второй попытки Плагины работают только с DOM В applications.js и других файлах всё равно остаётся много разнообразного кода Проблемы с зависимостями остаются
12 Третья попытка
13 Почему можно рефакторить? Часто люди начинают обращаться с примерами, приведёнными на этой странице, как с какой-то божественной истиной. На самом деле Backbone.js предназначен быть довольно агностичным насчёт многих частых паттернов клиентского кода Если вы поймаете себя на том, что добавляете методы в Backbone.Model.prototype, или создаёте свои собственные базовые субклассы, не беспокойтесь так и было задумано.
14 Структура фрэймворка
15 Как будем действовать Backbone.View DOM- элемент JS- код Данные
16 Пример Backbone.View
17 Что можно вытащить
18 Что получается
19 Как рефакторить JS Backbone.View Сущности данных Backbone.Model, Backbone.Collection Зависимости Backbone.Router
20 Как рефакторить JS Backbone.View Сущности данных Backbone.Model, Backbone.Collection Зависимости Backbone.Router
21 Пример иерархии
22 Преимущества Backbone.View хорошо изолированы Поддерживаются сторонние решения Лёгкость рефакторинга Явная архитектура Приятная поддержка кода Лёгкая расширяемость Архитектура разрешает зависимости
23 Недостатки третьей попытки Надо знать Backbone.JS Подключаем дополнительные файлы (underscore.js, backbone.js) Много JS-файлов на странице
24 Решаем недостатки Надо знать Backbone.JS Много документации, в т.ч. на русском Подключаем дополнительные файлы (underscore.js, backbone.js) 2 файла, 11 кб Смело используем Много JS- файлов на странице Пользуемся компоновщиками ресурсов concat, uglify, yuicompressor, …
25 Пример
26 Спасибо за внимание. Вопросы. Алексей Авдеев Нижний Новгород, Go-Promo, go-promo.ru
Еще похожие презентации в нашем архиве:
© 2024 MyShared Inc.
All rights reserved.