УДК 004.4
ВЕБ-ПРИЛОЖЕНИЕ ДЛЯ ОБРАБОТКИ ИЗОБРАЖЕНИЙ БОЛЬШИХ ОБЪЕМОВ
WEB APPLICATION FOR PROCESSINg LARgE VOLUME IMAgES
О. Н. Виничук,
«Новости науки и технологий» № 3 (54) 2020
аспирантка Белорусского государственного университета информатики и радиоэлектроники», г. Минск, Республика Беларусь
O. Vinichuk,
Postgraduate Student of the Byelorussian State University of Informatics and Radioelectronics, Minsk, Republic of Belarus
Дата поступления в редакцию — 07.05.2020 г.
В статье представлены результаты разработки веб-приложения для обработки изображений больших объемов. По сравнению с существующими аналогами, разработанное приложение позволяет снизить требования к аппаратно- программным средствам, в частности: сократить объем памяти, необходимой для хранения изображений, снизить вре- мя их обработки, а также обеспечить качественное отображение изображений на веб-страницах.
НаучНые публикации
Based on an analysis of existing web application development technologies, еру web application developed for processing large-volume images. Compared with existing analogs, the developed application allows you to reduce the hardware and soft- ware requirements, in particular: reduce the amount of memory needed to store images, reduce its processing time, and also ensure high-quality display of the images on web pages.
Ключевые слова: производительность, скорость, изображения больших объемов, многостраничные и одностраничные веб- приложения, диаграмма вариантов использования, диаграмма деятельности.
Keywords: performance, speed, high volume images, multi- and single page applications, use case diagram, activity diagram.
Многие отрасли науки и техники, име- ющие отношение к получению, обработке, хранению и передаче информации, в значи- тельной степени ориентируются в настоящее время на развитие систем, в которых инфор- мация имеет характер изображений. Изо- бражение, которое можно рассматривать как двумерный сигнал, является значительно бо- лее емким носителем информации, чем его обычное одномерное представление.
«Новости науки и технологий» № 3 (54) 2020
В век информационных технологий об- работка изображений становится все бо- лее актуальным вопросом. Как минимум, это необходимо для цифровых фотографий, что связано с особенностью получения изо- бражения цифровыми фотоаппаратами. Из- вестно [1], что зрительная система человека, в отличие от фотоаппаратов, обладает тре- мя примечательными способностями или эффектами: хроматическая адаптация (спо- собность человеческого зрения мгновен- но подстраиваться под цвет окружающего освещения), эффект одновременного кон- траста (способность зрительной системы че- ловека к лучшему разделению цветов объек- тов, соседствующих друг с другом), сохране- ние памятного цвета (способность человека хранить в памяти цвета, которые он когда- то видел). Ввиду описанных выше причин можно сделать вывод, что изображение, по- лученное с помощью цифрового фотоаппа- рата, может сильно отличаться от непосред- ственных визуальных представлений о сни- маемом объекте. В этой связи можно конста- тировать, что цифровая обработка изобра- жений направлена в том числе и на то, что- бы приблизить фотографию к привычному для сознания и зрения виду.
В последнее время список сервисов и ре- сурсов в Интернете достаточно расширил- ся. Интернет превратился из однообразных статических html-страниц в мощный инстру- мент интерактивности и общения с конеч- ными пользователями. В связи с этим веб- приложения в настоящее время приобре- ли особую популярность ввиду предоставле- ния различных преимуществ, которые отсут- ствуют в обычных настольных приложени- ях (десктоп-приложениях). Исходя из этого, можно сформулировать следующую гипотезу: веб-приложения можно выделять как отдель- ное ключевое звено из всей цепочки приложений. К сожалению, десктоп-приложения раз- виваются не так быстро и стремительно, как веб-технологии. Большое множество ком- паний переходят с обычных приложений на веб-приложения именно потому, что видят в них будущее. На основании вышеописанной характеристики десктоп-приложений и веб- приложений были выделены основные преи-
мущества работы с веб-приложениями.
Установка. Установка веб-приложений дешевле и намного проще. Для работы с веб-приложениями, как правило, не тре- буется установка дополнительного про- граммного обеспечения — пользователю для полнофункциональной работы доста- точно стандартного браузера, который име- ется в пакете установленных программ лю- бой операционной системы. При работе же с десктоп-приложениями обязательно требу- ется установка данного приложения и, воз- можно, для бесперебойной работы — допол- нительного программного обеспечения (как правило, дополнительные драйверы или рас- ширения).
Обновление. Обновление веб-приложе- ний дешевле и намного проще. Чтобы уста- новить обновление веб-приложения, его не- обходимо обновить только на сервере, и для работы с новой версией пользователю доста- точно лишь перезагрузить страницу.
Универсальность. Веб-приложения бо- лее универсальны и практичны для конеч- ного пользователя. Ввиду того, что веб- приложение хранится на сервере, доступ к нему возможен с любого устройства, где имеется доступ к Интернету и установлен браузер. Таким образом, напрашивается вы- вод, что доступ к веб-приложению возмо- жен из-под любой операционной системы и с любого устройства. К сожалению, для реализации таких возможностей десктоп- приложений существует только один выход: разработка отдельных приложений под кон- кретную операционную систему и отдельных приложений для различных устройств. Од- нако в случае, если приложения будут иметь общий доступ к базе данных, которая долж- на храниться на сервере, необходимо будет также обеспечить доступ к Интернету.
Хранение данных. Веб-приложения об- легчают организацию хранения данных. Если есть необходимость обращаться к од- ним и тем же данным из разных точек досту- па, то намного проще организовать их хране- ние в одном месте или, как вариант, обеспе- чить облачное хранилище данных.
Чтобы наладить стабильную работу сложных веб-приложений, желательно ис- пользовать технологии, которые дадут наи- лучшую производительность и скорость. На сегодня существует два способа разработки веб-приложений [2]:
SPA (Single Page Applications) — одно- страничные приложения;
MPA (Multi Page Applications) — много- страничные приложения.
При таком подходе каждый раз, ког- да приложение запрашивает данные либо отправляет их на сервер, оно вынуждено получать новую страницу в полном объеме, а затем отображать ее в браузере. При ис-
НаучНые публикации
пользовании такого способа разработки веб- приложений затрачиваются соответству- ющие ресурсы на отображение одних и тех же элементов, соответственно, это влияет на скорость и производительность функциони- рования системы «пользователь — сервер». Многие веб-разработчики, чтобы хоть как- то повысить скорость обработки и снизить общую нагрузку как на сервер, так и на поль- зователя, используют библиотеку jQuery.
Для относительно простых веб-при- ложений такой способ вполне подходит, од- нако ввиду того что веб-приложение для обработки изображений большого объе- ма обладает рядом функциональных воз- можностей, которые будут нагружать веб- приложение, то речь идет о том, как уско- рить сам процесс обработки данных. Все это ведет к тому, что размер трафика у МРА за- метно увеличивается, и при многостранич- ном подходе неминуемо появляются пробле- мы с производительностью.
Необходимо пояснить, что под термином
«изображение большого объема» понимается цифровое изображение (растровое или век- торное), занимающее объем более 8–10 Мб. Самым простым примером такого изображе- ния может быть цифровая фотография вы- сокого качества.
«Новости науки и технологий» № 3 (54) 2020
Для решения проблемы с производи- тельностью был выбран способ SPA для соз- дания веб-приложений. Архитектура у SPA устроена таким образом, что при перехо- де на новую страницу обновляется только часть контента. Таким образом, нет необхо- димости повторно загружать одни и те же элементы. Это очень удобно не только для пользователей, но и для разработчиков. Для разработки SPA используется один из самых популярных языков программирования — JavaScript, а также библиотека jQuery.
При создании html-страниц с использо- ванием способа SPA можно выделить ряд до- стоинств по отношению к MPA:
более быстрая загрузка веб-страниц;
улучшенное восприятие пользова- тельского интерфейса, поскольку загрузка
НаучНые публикации
данных с сервера происходит в фоновом режиме;
нет необходимости представлять код на сервере для визуализации страницы;
возможность использования одного и того же серверного кода как для веб-прило- жений, так и для мобильных приложений.
На самом деле, SPA — это эволюция спо- соба MPA и технологии обмена данными в фоновом режиме AJAX. При таком под- ходе только структура веб-страницы стро- ится на сервере, все остальное генерирует- ся средствами JavaScript. SPA запрашива- ет html-разметку и данные раздельно и ви- зуализирует результаты непосредственно в браузере. Описанный выше подход пред- ставлен в [1].
В ходе разработки веб-приложения не- обходимо было спроектировать диаграмму деятельности, диаграмму вариантов исполь- зования, а также схемы алгоритмов.
В качестве логического представле- ния данных спроектированы две диаграм- мы UML: диаграмма вариантов использова- ния (use case diagram) и диаграмма деятель- ности (activity diagram). Данные диаграммы наиболее полно отражают основные про- цессы, которые происходят в приложении, а также возможности его использования.
«Новости науки и технологий» № 3 (54) 2020
Суть диаграммы вариантов использо- вания заключается в том, что проектируе- мая система представляется в виде множе- ства различных действующих лиц или акте- ров, взаимодействующих с системой при по- мощи вариантов использования [3]. В каче- стве актера или действующего лица может выступать любая сущность, которая взаи- модействует с системой извне. В роли сущ- ности. чаще всего выступает человек, однако. в некоторых системах. в роли сущности мо- жет выступать техническое устройство, бло- ки программы или программа в целом. Вари- анты использования необходимы для описа- ния подробных процессов функционирова- ния системы, чтобы впоследствии предоста- вить действующему лицу. Каждый вариант использования определяет какой-либо набор
действий, который, в свою очередь, соверша- ется приложением при диалоге с основным действующим лицом.
Как правило, диаграмма вариантов ис- пользования проектируется во время изуче- ния предметной области и технического за- дания приложения. Спецификация, в кото- рой детально отражены основные функци- ональные возможности приложения, слу- жит впоследствии основой для тестирова- ния веб-приложения.
Диаграмма вариантов использования, спроектированная для разработки веб- приложения для обработки изображений большого объема, включает одно главное действующее лицо — непосредственно са- мого пользователя.
При проектировании диаграммы вари- антов использования были использованы два основных вида связей, которые пред- ставлены на рис. 1:
include — связывает между собой вари- анты использования как обязательное дей- ствие, которое необходимо для дальнейшей и корректной работы веб-приложения;
extend — связывает между собой вари- анты использования необязательным дей- ствием (это, как правило, дополнительные функции веб-приложения).
В диаграмме вариантов использования, спроектированной для разработки веб-при- ложения для обработки изображений боль- шого объема, непосредственно сам пользо- ватель взаимодействует с главным вариан-
Рис. 1. Связи Use Case
том использования веб-приложения при по- мощи связи ассоциации. Вариант исполь- зования «Работать с веб-приложением для обработки изображений большого объема» описывает основные функциональные воз- можности, которые включают и расширяют дополнительные варианты использования:
«Просмотреть главную страницу» — является обязательным действием для поль- зователя;
«Добавить изображение» — обязатель- ное действие, которое, в свою очередь, вклю- чает необходимый набор действий для до- бавления изображений;
«Редактировать» — необязательное действие, дополнительный функционал веб- приложения, который, в свою очередь, вклю- чает необходимый набор действий для ра- боты с действиями пользователя (отменить действие, вернуть действие);
«Работать с изображением» — обяза- тельное действие, которое, в свою очередь, включает необходимый набор действий для работы с изображениями, как правило, его трансформирование;
«Работать с фильтрами» — обязатель- ное действие, которое, в свою очередь, вклю- чает необходимый набор фильтров для ре- дактирования изображений;
«Работать со слоями» — необязательное действие, дополнительный функционал веб- приложения, который, в свою очередь, вклю- чает необходимый набор действий для рабо- ты со слоями;
«Работать со скриптами» — необяза- тельное действие, дополнительный функ- ционал веб-приложения, который, в свою очередь, включает необходимый набор дей- ствий для работы со скриптами языка Java- Script;
«Завершить работу с приложением» — обязательное действие, выход из приложе- ния.
Диаграмма вариантов использования представлена на рис. 2. Каждый основной ва- риант использования, в свою очередь, также детализируется.
НаучНые публикации
Вариант использования «Добавить изо- бражение» включает в себя следующие дей- ствия:
«Открыть файл» — обязательное дей- ствие, позволяет поместить одно изображе- ние на рабочую область;
«Открыть через URL» — обязательное действие, позволяет поместить одно изо- бражение на рабочую область посредством ссылки с Интернета;
«Импортировать файл» — необязатель- ное действие (дополнительный функционал), позволяет поместить несколько изображе- ний на рабочую область к уже добавленно- му изображению;
«Импортировать через URL» — необя- зательное действие (дополнительный функ- ционал), позволяет поместить несколько изображений на рабочую область посред- ством ссылки с Интернета к уже добавлен- ному изображению.
Вариант использования «Работать с изо- бражением» включает в себя следующие ва- рианты использования:
«Масштабировать» — необязательное действие (дополнительный функционал), позволяет изменить масштаб изображения;
«Повернуть» — необязательное дей- ствие (дополнительный функционал), позво- ляет повернуть изображение;
«Произвести скос» — необязательное действие (дополнительный функционал), позволяет изменять скос изображения;
«Новости науки и технологий» № 3 (54) 2020
«Отразить по горизонтали» — необя- зательное действие (дополнительный функ- ционал), позволяет произвести отображение изображения по горизонтали;
«Отразить по вертикали» — необяза- тельное действие (дополнительный функцио- нал), позволяет произвести отображение изображения по вертикали.
Вариант использования «Работать с фильтрами» включает в себя следующие ва- рианты использования:
«Изменить яркость» — необязательное действие (дополнительный функционал), позволяет изменить яркость изображения;
НаучНые публикации
28
«Новости науки и технологий» № 3 (54) 2020
Рис. 2. Диаграмма вариантов использования
«Изменить цветность» — необязатель- ное действие (дополнительный функционал), позволяет изменить цветность изображения в формате RGB;
«Применить размытие» — необязатель- ное действие (дополнительный функционал), позволяет изменять размытие изображе- ния (чем больше введенное число, тем доль- ше происходит размытие изображения);
«Применить размытие по Гауссу» — не- обязательное действие (дополнительный функционал), позволяет изменять размытие изображения по Гауссу;
«Изменить насыщенность» — необя- зательное действие (дополнительный функ- ционал), позволяет изменить насыщенность изображения;
«Применить обнаружение края» — не- обязательное действие (дополнительный функционал), позволяет изменить изобра- жение посредством обнаружения краев;
«Применить усиление краев» — необя- зательное действие (дополнительный функ- ционал), позволяет изменить изображение посредством усиления краев;
«Применить теснение» — необязатель- ное действие (дополнительный функционал), позволяет изменить тиснение изображения;
«Применить резкость» — необязатель- ное действие (дополнительный функционал), позволяет изменить тиснение изображения. Вариант использования «Работать со слоями» включает в себя следующие вариан-
ты использования:
«Масштабировать» — необязательное действие (дополнительный функционал), позволяет изменять масштаб слоя;
«Повернуть» — необязательное дей- ствие (дополнительный функционал), позво- ляет повернуть слой;
«Произвести скос» — необязательное действие (дополнительный функционал), позволяет произвести скос слоя;
«Отразить по вертикали» — необязатель- ное действие (дополнительный функционал),
«Отразить по горизонтали» — необя- зательное действие (дополнительный функ- ционал);
НаучНые публикации
«Обрезать» — необязательное дей- ствие (дополнительный функционал), позво- ляет обрезать часть слоя;
«Переместить» — необязательное дей- ствие (дополнительный функционал), позво- ляет перемещать слой по рабочей области;
«Скрыть» — необязательное дей- ствие (дополнительный функционал), позво- ляет скрыть слой с рабочей обрасти;
«Показать» — необязательное дей- ствие (дополнительный функционал), позво- ляет отобразить слой, который был скрыт на рабочей обрасти;
«Удалить» — необязательное дей- ствие (дополнительный функционал), позво- ляет удалить слой с рабочей области.
Диаграмма деятельности представлена на рис. 3.
Диаграмма деятельности (activity diagram), в отличие от диаграммы вариантов использования (use-case diagram), отражает более детальную и последовательную рабо- ту с веб-приложением [4]. Если диаграмма вариантов использования дает ответ на во- прос «Что должно делать веб-приложение?», то диаграмма деятельности отвечает на во- прос «Как работает веб-приложение?».
«Новости науки и технологий» № 3 (54) 2020
Посредством диаграммы деятельности описывается логика процедур, функций, ме- тодов, бизнес-процессов. Зачастую диаграм- ма деятельности напоминает блок-схему, однако принципиальная разница между диаграммой деятельности и нотацией блок- схемы в данном случае заключается в том, что диаграмма деятельности поддерживает параллельное выполнение процессов в слож- ных системах.
На диаграмме деятельности представ- лено начальное и конечное состояние веб- приложения, то есть спроектирована подроб- ная работа веб-приложения. Как видно из ди- аграммы, в любой момент пользователь может завершить работу с веб-приложением, точно также как и из любого места сможет вернуться к возможности выбора пункта меню.
Чтобы начать работу с веб-приложением, необходимо выбрать пункт меню. С учетом
НаучНые публикации
30
«Новости науки и технологий» № 3 (54) 2020
Рис. 3. Диаграмма деятельности
того, что диаграмма деятельности отражает подробную схему работы веб-приложения, можно сказать, что в качестве основных бло- ков с действиями можно выделить следую- щие:
работа с файлами;
редактирование;
работа со скриптами JavaScript;
работа с изображениями;
работа с фильтрами;
работа со слоями;
работа с текстами;
перемещение объектов.
Вышеописанные действия выступают в роли основных ввиду того, что пользователь сразу после запуска веб-приложения попада- ет на главную страницу, на которой и пред- ставлен перечень данных действий. Одно- временное выполнение нескольких действий на одной странице отсутствует. Каждое из основных действий также детализируется, включая важные функции веб-приложения.
Важно отметить, что на диаграмме дея- тельности отсутствуют состояния так назы- ваемого зависания, то есть состояние веб- приложения в любой ситуации так или ина- че реагирует на действия пользователя и ото- бражает на экране устройства соответствую- щие данные.
На рис. 4 представлена схема алгоритма работы приложения. Как видно из рисунка, схема алгоритма работы веб-приложения от- личается от представленных выше диаграмм. Основные функции веб-приложения здесь отображены в виде схем алгоритма.
При работе с веб-приложением для об- работки изображений большого объема не- обходимо учитывать тот факт, что вся рабо- та таких приложений построена на скрип- тах языка JavaScript. Ввиду этого при постро- ении общего алгоритма идет проверка на подключение скриптов, то есть, если скрип- ты в веб-приложении отсутствуют, можно завершать работу с приложением, обработ- ка изображений будет недоступна. Если же все скрипты подключены корректно, то сле- дующим шагом будет определение рабочей
НаучНые публикации
Рис. 4. Схема алгоритма работы приложения
«Новости науки и технологий» № 3 (54) 2020
области, а именно области Canvas, на кото- рую помещаются изображения для после- дующей обработки. После того как иници- ализирована рабочая область и помещено изображение, происходит основная работа веб-приложения. С рабочей области Canvas средствами JavaScript происходит получе- ние объекта-изображения и в зависимости от действий пользователя производится его обработка.
Таким образом, предложено веб-прило- жение для обработки изображений боль- шого объема. Приложение построено
НаучНые публикации
по одностраничной технологии и, в отличие от известных, позволяет снизить требования к аппаратно-программным средствам при ее реализации, в частности: сократить объем памяти, необходимой для хранения изобра- жений, и уменьшить время его обработки, а также обеспечить качественное отображе- ние самого изображений на веб-страницах.
Литература:
Листопад, Н. И. Разработка веб-приложения для обработки цифровых изображений / Н. И. Листопад,
О. Н. Виничук // Материалы международного научно- технического семинара «Телекоммуникации: сети и технологии, алгебраическое кодирование и безопас- ность данных». — Минск, 2019. — С. 114–117.
Флэнаган, Д. JavaScript. Подробное руковод- ство / Д. Флэнаган / пер. с англ. — СПб: Символ-Плюс, 2008. — 992 с.
Кузница IT-решений [Электронный ресурс]. — Режим доступа: http://shiftoffproblem.com/what-is-spa- and-mpa. — Дата доступа: 04.05.2020.
Буч, Г. Язык UML. Руководство пользователя. / Г. Буч, Д. Рамбо, И. Якобсон. 2-е изд.: Пер. с англ. Му- хин Н. — М.: ДМК Пресс, 2006. — 496 с.
УДК 339.9
меЖДУнАроДнЫЙ оПЫТ рАЗВИТИЯ УнИВерСИТеТСКИХ БИЗнеС-ИнКУБАТороВ И ИХ роЛЬ В СоЗДАнИИ ЦИФроВЫХ ИнноВАЦИЙ
INTERNATIONAL EXPERIENCE IN UNIVERSITy BUSINESS-INCUBATORS DEVELOPMENT AND THEIR ROLE IN STIMULATION
OF DIgITAL INNOVATIONS
Е. В. Столярова,
доцент кафедры международных экономических отношений Белорусского государственного университет, канд. экон. наук, г. Минск, Республика Беларусь
K. Staliarova,
Associate Professor of the Chair of World Economic Relations of the Belarusian State University, PhD in Economics, Minsk, Republic of Belarus
Дата поступления в редакцию — 11.05.2020 г.
«Новости науки и технологий» № 3 (54) 2020
В статье рассматривается сущность университетских бизнес-инкубаторов и их роль в создании цифровых инноваций, а также опыт развития таких инкубаторов в различных странах, в том числе в европейских странах с малой экономикой. В статье также проанализированы университетские бизнес-инкубаторы в Республике Беларусь и их вклад в цифровиза- цию экономики и сформулированы рекомендации по их дальнейшему развитию.
This article is devoted to the analysis of the university business-incubators and their role in the development of digital innova- tions. The article also considers experience of different countries, including European countries with small economy, in develop- ment of such incubators. The article also includes the analysis of business-incubators of Belarusian universities and their input in digitalization of the economy, and recommendations on their further development.
Ключевые слова: университетские бизнес-инкубаторы, цифровые инновации, цифровизация, мировая экономика, европейские страны с малой экономикойи.
Keywords: university business-incubators, digital innovations, digitalization, world economy, European countries with small economy.
Цифровые инновации являются важ- ной составляющей формирования цифро-
32
вой экономики страны. В их создании могут быть задействованы различные субъекты