1. Общая информация о проекте

Название:

Vue.js – прогрессивный front-end фреймворк на языке JavaScript для создания UI

Адрес проекта

• github.com/vuejs/vue - репозиторий

• vuejs.org/ - документация фреймворка

Цель проекта:

Проект был создан для организации и упрощения жизни веб-разработчиков, которые создают одностраничные приложения. В зависимости от поставленных задач его можно использовать как для полноценной разработки с 0, так и для внедрения в уже готовые проекты. Vue.js может легко масштабироваться из простой библиотеки в полноценный web-фреймворк, который легко уживается с другими JavaScript-библиотеками.

Vue.js реализует идеи реактивного программирования, то есть объекты могут автоматически изменяться из Model в View и наоборот из View в Model.

Статистика с гитхаба (19.12.17 13:00):

• stars: 77.145

• commits: 2.449

• branches: 19 (5 active)

• releases: 221

• contributors: 161

• fork: 11.395

Возраст проекта, активность разработки

Первый релиз проекта был в феврале 2014 года. В данный момент актуальная версия 2.4.4, релиз которой был 14.09.2017. Проект находится в стадии активной разработки.

Сейчас на проекте есть 64 открытых ишью и 5.734 закрытых из которых 6 открыли на этой неделе, а закрыто было около 44.

Объем проекта (количество файлов): файлов всего – 518, файлов с исходным кодом 438.

Количество строк кода:

• Физическое количество строк (всего): 167163.

• Количество строк исходного кода: 154766.

• Строк комментариев: 16992.

• Однострочных комментариев: 8923.

• Количество строк блочных комментариев: 8083.

• Количество пустых строк: 1185.

• Количество To-Do записей: 9.

Используемые языки и технологии:

• система контроля версий Git

• репозиторий – GitHub

• языки:

  • NodeJs

  • TypeScript

  • JavaScript

• Тесты:

  • Karma

  • Jasmine

  • Mocha

  • Selenium

• Инструменты:

  • Babel

  • Webpack

  • Rollup

Под какой лицензией создается проект: MIT. Это группа лицензий для открытого программного обеспечения. Данная лицензия позволяет использовать программный продукт в проектах, обязательное условие - указывать автора.

2. Управление проектом

Кто осуществляет разработку (организация, частное лицо)

Разработку осуществляет большая международная команда программистов, каждый из которых имеет постоянное место работы и вносит вклад в развитие фреймворка в свободное время. Такой подход характерен для большого количества open-source проектов.

На момент написания ОДЗ в репозитории на Github был 161 контрибутор.

Как ведется управление дефектами (баг-трекер, список рассылки)

Относительно небольшой размер проекта позволяет не прибегать к использованию отдельного баг-трекера, списков рассылки и любых других способов управления дефектами.

Для сообщения о некорректной работе фреймворка или предложения улучшений используется встроенный в Github простенький баг-трекер (раздел Issues).

Также существует ресурс new-issue.vuejs.org/, который помогает правильно завести баг на Github.

Существует ли какое-нибудь руководство для людей, которые хотят присоединиться к проекту

Люди, которые хотят присоединиться к разработке, могут найти много полезной информации на официальном сайте по адресу vuejs.org/v2/guide/join.html. Там указаны ссылки на форум, чат, обзор экосистемы фреймворка.

Для тех же, кто уже готов делать вклад, на Github есть страница с Contribution Guide - github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md. Там описано как развернуть окружение для разработки, с какими ветками необходимо работать и в каком виде нужно делать коммиты и оформлять пулл-реквесты, чтобы они были приняты мейнтейнерами проекта (основными разработчиками).

3. Анализ исходного кода

Code Style проекта. Следуют ли нему разработчики или проект неоднороден по стилю?

В проекте прослеживается единый Code Style, которого придерживаются все разработчики. Для проверки стиля написания кода используется популярный линтер ESLint. Существует отдельный репозиторий для разработчиков фреймворка с конфигурацией для ESLint - github.com/vuejs/eslint-plugin-vue-libs.

Например, на проекте используются такие правила:

1. В стрелочных функциях вокруг стрелочки должны быть пробелы

2. После запятых должны ставиться пробелы

3. В ключах объектов после двоеточия должны ставиться пробелы

4. Нельзя смешивать пробелы и табуляцию

5. Следует всегда использовать одинарные кавычки

Стратегия ветвления в проекте

Ранее ветки активно использовались и для каждого релиза создавалась отдельная ветка. Сейчас веток гораздо меньше, а для пометки релизов используются метки.

Активных веток всего 5. Из них особое внимание стоит уделять только двум - dev и master. Стратегия такова - все коммиты и пулл-реквесты идут в ветку dev, а перед релизом все мержится в ветку master и создается метка.

Результат анализа исходного кода статическим анализатором.

Поскольку код прогоняется через линтеры ESLint и Flow и пишется таким образом, чтобы срабатываний не было, то было принято решение использовать сторонний анализатор - JSInspect, который ищет нарушения принципа DRY - повторяемые куски кода.

Было обнаружено 10 срабатываний, но среди них ни одного такого, которое можно было бы исправить выносом части кода в отдельный метод.

Таким образом, можно сделать вид, что жесткие требования к выполнению статического анализа перед коммитом, делают код фреймворка достаточно качественным.

4. Документация и комментарии

Как документируется проект? Какие инструменты используются?

Документирования кода проекта отсутствует. В основном, для документирования проектов на языке JavaScript используют JSDoc.

Документация самого фреймворка находится по ссылке vuejs.org/

Наличие комментариев в коде, их характер, оценочное количество количества.

Комментарии в коде есть, но их не очень много, часть из них используется для статических анализаторов. Например, аннотации для статического анализатора типов Flow. Поскольку JavaScript - язык достаточно простой, то комментирование и документирование кода часто излишни, код достаточно понятен и без них. В JavaScript разработке предпочтение отдается принципу самодокументируемого кода — такого кода, где переменные и функции именуются таким образом, что при взгляде на код понятно, как он работает.

Посчитайте метрику "плотность комментариев"

16992 / 167163 = 0,102 строки комментария на 1 строку кода.

Комментарии TODO, FIXME, их возраст, количество:

• TODO – 9 записей в 6 файлах. Комментарии достаточно свежие, все за 2017 год

• FIXME – ни одной записи не найдено

5. Инструменты автоматической сборки

Какие инструменты автоматической сборки используются?

Для автоматической сборки используются NodeJS скрипты.

Какие цели (targets) реализованы?

Cкрипты используются для:

• сборки JS-файлов в один общий;

• запуск различных тестов;

• проверка кода статическими анализаторами;

Среди целей можно выделить такие:

• dev - cборка версии для разработчиков (с наличием отладочной информации)

• test - запуск тестов

• lint - запуск проверки кода анализатором ESLint

• build - сборка продакшн-версии фреймворка

Используются ли средства Continuous Integration?

В проекте используется CircleCI. После каждого коммита выполняется запуск джобов для развертывания проекта и различных проверок - линтинга (вид статического анализа), покрытия кода тестами, самого процесса тестирования. Это позволяет автоматически следить за тем, чтобы во фреймворк попадал только качественный оттестированный код.

6. Средства раннего обнаружения дефектов

Использует ли проект тесты. Какого типа? Какие фреймворки для тестирования используются?

Проект использует и интеграционные, и функциональные тесты.

Для написания тестов используются такие библиотеки/фреймворки:

• Mocha – эта библиотека содержит общие функции для тестирования, включая describe и it..

• Karma – инструмент, который порождает веб-сервер, выполняющий исходный код для каждого из подключенных браузеров. Результаты каждого теста для каждого браузера отображаются через командную строку разработчику, чтобы он мог видеть какие браузеры и тесты прошли, а какие - нет.

• Nightwatch.js - это простое в использовании решение для тестирования End-to-End (E2E) на базе Node.js для браузеров и веб-сайтов. Он использует мощный API W3C WebDriver для выполнения команд и проверки утверждений на элементах DOM.

• Jasmine - это behavior-driven development framework для тестирования JavaScript кода. Он не зависит от каких-либо других фреймворков JavaScript. Он не требует DOM. Имеет чистый, очевидный синтаксис, чтобы легко писать тесты. В репозитории настроены pre-commit хуки, которые запускают ESLint для проверки измененных файлов

6