Клиентская программа, Инструменты разработки - Визуализация графа цитирования

Клиентская программа - является основной частью программы, так как она реализует все алгоритмы, описанные в главе 2 данного документа. Несмотря на то, что клиентская часть программы зависит от серверной, реализуемые алгоритмы были спроектированы максимально независимо.

Инструменты разработки

Основная часть работы написана, как веб-приложение, на языках программирования HTML, CSS и JavaScript. Эти языки являются стандартным набором при создании веб страниц, так как их умеют интерпретировать все современные браузеры. Во время разработки использовались их последние стандарты, поскольку они описываю функции, позволяющие удобно работать с графикой и данными.

Во время работы использовались библиотеки Require. js [21], jQuery [22], cardinal-spline-js [23], Bootstrap [24].

Require. js реализует спецификацию AMD [25] (Asynchronous module definition), позволяющую организовывать JavaScript проект в виде асинхронных модулей. Модуль - это JavaScript код, имеющий другие модули в качестве зависимостей и имеющий возможность подключения в качестве зависимости. Модули асинхронно подключаются с помощью библиотеки по мере их надобности, поэтому нет необходимости в том, чтобы прописывать ссылки на все файлы в HTML коде вручную. Такая практика позволяет легко менять, добавлять, удалять модули и масштабировать приложение. В данной программе почти все модули написаны по принципу "Один модуль - один класс", так как это позволяет поддерживать объектно-ориентированный стиль программирования.

JQuery - мультифункциональная библиотека, упрощающая взаимодействие HTML и JavaScript, облегчающая работу с AJAX и т. д. В данной работе jQuery использовался для создания, управления DOM элементами страницы и написания обработчиков событий. Здесь стоит отметить, что jQuery позволяет работать со слабо-стандартизированными функциями во всех основных браузерах одинаково. Также jQuery использовался для общения с сервером посредством AJAX.

Cardinal-spline-js - маленькая библиотека, строящая кардинальный сплайны по точкам. В частности, она может расширять функционал элемента Canvas, отрисовывая сплайны сразу на нем. Ее функционал используется в конечном этапе алгоритма Bubble Sets.

Bootstrap - фронт-энд фреймворк для создания веб страниц, предоставляющий разработчику сетки, различные элементы - кнопки, формы, таблицы и т. д. Поставляется в виде CSS кода. Также опционально можно подключить JavaScript библиотеку, позволяющую создавать динамичные элементы, вроде всплывающих окон и сворачивающихся панелей. Bootstrap на данный момент является почти стандартом при верстке веб страниц, поэтому был выбран именно он.

Так как программа писалась на последних версиях языка JavaScript встал вопрос поддержки браузеров, еще не реализовавших новый функционал. Для решения данной проблемы использовался инструмент Babel состоящий из JavaScript компилятора и библиотеки полифила. Компилятор преобразовывал код написанный на ES6 таким образом, чтобы он полностью соответствовал предыдущему стандарту - ES5, но выполнял те же функции. Компилятор может преобразовывать синтаксис кода, однако не переменные и классы. Поэтому компилятор используется в связке с библиотекой полифилом, подключающейся на странице. Эта библиотека добавляет недостающие классы, функции и т. д. на страницу.

Похожие статьи




Клиентская программа, Инструменты разработки - Визуализация графа цитирования

Предыдущая | Следующая