MDA for Frontend

Даниил Гительсон

Читабельность кода

  • Документация

    
// The order is important:
//    v3 followed by v1
var notificationDetails =
    ['FILTERRING_V2', 'FILTERING_V1']

  • Повышение уровня абстракции

Связывание рук

  • Слабое: React
    Полная свобода в шаблонах
  • Сильное: Ember
    Специально суженная Handlebars

Декларотивный подход

  • Помогает связывать руки
  • Требует формализации словаря

Пример: логирование

Было 


logger.event({name:'user_logged_in',uid:uid});

Пример: логирование

Стало 


abstract class EventsLogger {
    void userLoggedIn(String name);
}

var logger = generateLoggerImpl(EventsLogger);

logger.userLoggedIn(userId);

MDA

  • Формализуем язык предметной области
  • Описываем задачу на этом языке
  • Описываем трансформацию описания
    в более низкий уровень

MDA

MDA ЯП
Модель Объект
Язык/Метамодель класс/прототип
Метаязык/Метаметамодель N/A

Метаметаметаметамодель

MDA

  • + Документация становится кодом
  • - Создавать языки дорого
  • Подходит если моделей много,
    а языков мало

Пример: Формы

  • Много разных форм
  • Небольшой набор компонентов
  • Вычислимые поля
  • Проверка на сервере

Пример: Формы

  • Много разных форм
  • Небольшой набор компонентов
  • Вычислимые поля
  • Проверка на сервере

Пример: Формы

  • Метамодель данных
  • Метамодель форм
  • Специальный язык выражений
  • Описание в XML
  • Кодогенерация в JS

Итого

  • Инструментов мало: EMF
  • Выскоий порог вхождения
  • Хорошо бы поменять ситуацию