Первая страница
Наша команда
Контакты
О нас

    Головна сторінка



Розробка веб-додатку з імітаційного моделювання обчислювальних систем

Розробка веб-додатку з імітаційного моделювання обчислювальних систем




Сторінка8/16
Дата конвертації10.03.2017
Розмір0.82 Mb.
ТипПояснювальна записка
1   ...   4   5   6   7   8   9   10   11   ...   16

Варіантний аналіз засобів розробки веб-додатку


На даний час існує велика кількість фреймворків та бібліотек для розробки веб-додатків з використанням мови програмування JavaScript. В ході аналізу було розглянуто найбільш поширені з них.

AngularJS це JavaScript-фреймворк з відкритим програмним кодом, який розробляє Google. Призначений для розробки односторінкових додатків, що складаються з одної HTML сторінки з CSS і JavaScript. Його мета - розширення браузерних застосунків на основі шаблону Модель-вид-контролер (MVC), а також спрощення їх тестування та розробки [10].

Модель-вигляд-контролер (або Модель-вид-контролер, англ. Model-view-controller, MVC) – архітектурний шаблон, який використовується під час проектування та розробки програмного забезпечення [11].

Відкрите програмне забезпечення (англ. open-source software) - програмне забезпечення з відкритим сирцевим кодом.
Розробка програмного забезпечення (англ. software engineering, software development) - це рід діяльності (професія) та процес, спрямований на створення та підтримку працездатності, якості та надійності програмного забезпечення, використовуючи технології, методологію та практики з інформатики, керування проектами, математики, інженерії та інших областей знання.

Цей шаблон поділяє систему на три частини: модель даних, вигляд даних та керування.

Моде́ль да́них (англ. Data model) - абстрактне представлення реального світу, що відображає тільки ті об'єкти, що безпосередньо стосуються програми. Це, як правило, визначає специфічну групу об'єктів, їх атрибутивне значення і відношення між ними.
Застосовується для відокремлення даних (модель) від інтерфейсу користувача (вигляду) так, щоб зміни інтерфейсу користувача мінімально впливали на роботу з даними, а зміни в моделі даних могли здійснюватися без змін інтерфейсу користувача.

Мета шаблону – гнучкий дизайн програмного забезпечення, який повинен полегшувати подальші зміни чи розширення програм, а також надавати можливість повторного використання окремих компонентів програми. Крім того використання цього шаблону у великих системах призводить до певної впорядкованості їх структури і робить їх зрозумілішими завдяки зменшенню складності.

картинки по запросу angular mvc diagram

Рисунок 2.1 – Діаграма взаємодії головних компонентів Angular


Фреймворк Angular працює зі сторінкою HTML, що містить додаткові атрибути і пов'язує області вводу або виводу сторінки з моделлю, яка є звичайними змінними JavaScript. Значення цих змінних задаються вручну або отримуються зі статичних або динамічних JSON-даних.

AngularJS спроектований з переконанням, що декларативне програмування найкраще пасує для побудови інтерфейсів користувача та опису програмних компонентів, в той час як імперативне програмування пасує для опису бізнес-логіки.

Перекона́ння - вірування без жодного відтінку сумніву, але часто з емоційним забарвленням; встановлена думка, прийняте вірування. Як об'єкт, переконання - доктрина чи твердження, в яке хтось твердо вірить.
Імперати́вне програмува́ння - парадигма програмування, згідно з якою описується процес отримання результатів як послідовність інструкцій зміни стану програми. Подібно до того, як з допомогою наказового способу в мовознавстві перелічується послідовність дій, що необхідно виконати, імперативні програми є послідовністю операцій комп'ютера для виконання.
Декларативне програмування - парадигма програмування, відповідно до якої, програма описує, який результат необхідно отримати, замість описання послідовності отримання цього результату.
Фреймворк адаптує та розширює традиційний HTML, щоб забезпечити двосторонню прив'язку даних для динамічного контенту, що дозволяє автоматично синхронізувати модель та вид.
Тради́ція - досвід, звичаї, погляди, смаки, норми поведінки і т. ін., що склалися історично і передаються з покоління в покоління; звичайна, прийнята норма, манера поведінки, усталені погляди, переконання когось; узвичаєння, узвичаєність, неписаний закон.
У результаті AngularJS зменшує роль DOM-маніпуляцій з метою підвищення продуктивності і спрощення тестування.

React.js, здебільшого називають React, це open-source JavaScript бібліотека для створення інтерфейсів користувача, яка покликана вирішувати проблеми часткового оновлення вмісту веб-сторінки, з якими стикаються в розробці односторінкових додатків. Розробляється Facebook, Instagram і спільнотою індивідуальних розробників [12].

React дозволяє розробникам створювати великі веб-додатки, які використовують дані, які змінюються з часом, без перезавантаження сторінки. Його мета полягає в тому, щоб бути швидким, простим, масштабованим. React обробляє тільки користувацький інтерфейс у додатках. Це вважається тільки вид в модель-вид-контролер (MVC) шаблоні програмного забезпечення, і може бути використаний в поєднанні з іншими JavaScript бібліотеками або в великих структурах MVC, таких як AngularJS.

Instagram - безкоштовний додаток обміну фотографіями, що дозволяє користувачам робити фотографії, застосовувати до них фільтри, а також поширювати їх через свій сервіс і низку інших соціальних мереж. Є одним із найпопулярніших сервісів у мистецтві айфонографії.
Спільнота - це група людей, які з будь-якої причини відчувають досить спільного між собою, щоб мати спільні прагнення, цілі та структури.
Структу́ра (лат. structūra, англ. structure, рос. структура, нім. Struktur) - це характеристика складу та просторова картина складу об'єкта, речовини (ізотропна, анізотропна, кристалічна, аморфна, гомогенний чи колоїдний розчин, фазові суміші) взаєморозміщення формацій, частин, деталей, елементів, певний функціональний взаємозв'язок складових частин об'єкта, внутрішня будова.
Він також може бути використаний з React на основі надбудов, щоб піклуватися про частини без користувацького інтерфейсу побудови веб-додатків.

React підтримує віртуальний DOM, а не покладається виключно на DOM браузера. Це дозволяє бібліотеці визначити, які частини DOM змінилися, порівняно зі збереженою версією віртуального DOM, і використовуючи результат визначити, як найефективніше оновити DOM браузера.

В даний час React використовують Khan Academy, Netflix, Yahoo, Airbnb, Sony, Atlassian та інші.

Dojo Toolkit — бібліотека мови JavaScript з відкритим кодом, чи точніше інструментарій, створений, щоб спростити швидку розробку кросплатформових AJAX-застосунків та веб-сайтів. Розробка почата Алексом Расселом, Діланом Шіманом, Девідом Шонтзлером та іншими в 2004-тому. Бібліотека надає розробникам широкий спектр можливостей, від спрощення організації обміну даними з сервером, підтримки локального сховища і розбору дерева DOM, до використання готових віджетів для побудови інтерфейсу користувача (меню, wysiwyg-редактор, календар, динамічні таблиці, drag & drop, перевірка форм тощо), формування графіків/діаграм та задіяння нових технологій HTML5 (геопозиціювання, 3D-ефекти, API для сенсорних екранів).

Сенсорний екран або тачскрін (англ. Touchscreen) - пристрій для введення інформації, що є екраном, який реагує на дотики до нього.
Техноло́гія (від грец. τεχνολογια, що походить від грец. τεχνολογος; грец. τεχνη - майстерність, техніка; грец. λογος - (тут) передавати) - наука («корпус знань») про способи (набір і послідовність операцій, їх режими) забезпечення потреб людства за допомогою (шляхом застосування) технічних засобів (знарядь праці).
Бібліотека реалізує концепцію поділу даних та оформлення, що дозволяє підключати різні обробники в залежності від контексту, наприклад, оптимізовані для мобільних або стаціонарних систем. Офіційно підтримуються браузери (вказані мінімально підтримувані версії): Chrome 8, Firefox 3.6, Internet Explorer 6, Opera 11, Safari 5.

Prototype — JavaScript фреймворк, який спрощує роботу з Ajax і деякими іншими функціями. Незважаючи на його доступність у вигляді окремої бібліотеки, він зазвичай використовується програмістами поряд з Ruby on Rails, script.aculo.us і Rico.

Цей фреймворк підтримується такими браузерами: Internet Explorer (Windows) 6.0 , Mozilla Firefox 1.

Доступність (англ. Availability) - властивість інформаційного ресурсу, яка полягає в тому, що користувач та/або процес, який володіє відповідними повноваженнями, може використовувати цей ресурс відповідно до правил, встановлених політикою безпеки не очікуючи довше заданого (прийнятного) інтервалу часу.
Microsoft Internet Explorer - графічний веб-оглядач (браузер), який розробляє корпорація Microsoft.
Mozilla Firefox (укр. Мозілла Файрфокс, Жар-лис, Вогнелис, Вогняна Лисиця) - вільний безкоштовний веб-оглядач з відкритим кодом, заснований на ядрі Gecko (Проект Mozilla).
5 , Apple Safari 2.0 і Opera 9.25 . Підтримка даних браузерів також означає, що фреймворк підтримується Camino, Konqueror, IceWeasel, Netscape 7 , SeaMonkey, та іншими, які належать цим же сімействам.
SeaMonkey (укр. СіМанкі) - вільний кросплатформовий набір програм для роботи в Інтернеті, який є прямим нащадком Mozilla Suite. Координатором розробки є організація Seamonkey Council, що відокремилась від Mozilla Foundation.
Debian Iceweasel, раніше Debian Firefox - модифікація браузера Mozilla Firefox в Debian GNU/Linux, перейменована наприкінці 2006 року з метою позбавлення від ліцензійних обмежень на ім'я та художнє оформлення (артворк, англ. artwork)

Ext JS – це бібліотека JavaScript для розробки веб-застосунків і користувальницьких інтерфейсів, спочатку задумана як розширена версія Yahoo! UI Library, однак перетворена потім в окремий фреймворк. До версії 4.0 використовувала адаптери для доступу до бібліотек Yahoo! UI Library, jQuery або Prototype / script.aculo.us, починаючи з 4-ої версії адаптери відсутні. Підтримує технологію AJAX, анімацію, роботу з DOM, реалізацію таблиць, вкладок, обробку подій і всі інші нововведення Web 2.0.

З версії 2.1 бібліотека Ext JS передбачає подвійне ліцензування: може бути поставлена ​​за ліцензією GPL v3, або за комерційною ліцензією компанії Sencha. Починаючи з версії Ext JS 3.0 бібліотека розбивається на дві частини: Ext Core (набір JavaScript-функцій, що дозволяє створювати динамічні веб-сторінки з уніфікацією обробки в різних браузерах і розповсюджуваний за MIT-ліцензією) і Ext JS (власне набір віджетів для створення користувацьких інтерфейсів з подвійним ліцензуванням по GPL v3 або за комерційною ліцензією).

Ліце́нзія (лат. licentia - дозвіл) - у загальному значенні - це документ, що демонструє певний дозвіл. Документ державного зразка, що засвідчує право ліцензіата на провадження зазначеного в ньому виду господарської діяльності протягом визначеного строку за умови виконання ліцензійних умов.
Уніфікація (від. лат. unus - один, лат. facio - роблю; об'єднання) - приведення до одноманітності, до єдиної форми або системи. Раціональне скорочення числа видів об'єктів однакового функціонального призначення.
Динамічна веб-сторінка (англ. dynamic web page) - веб-сторінка, вміст якої може змінюватись. В початковому варіанті гіпертекстова навігація відбувалася між «статичними» документами. Однак з часом до веб-сторінок було додано інтерактивності, і такі сторінки почали називати динамічними.

Компанія, що розробляє і підтримує фреймворк Ext JS, спочатку носила назву Ext, LLC. до 14 червня 2010 року розробники jQTouch і Raphaël приєдналися до компанії Ext LLC, і компанія змінила найменування на Sencha, Inc., а Ext JS, зберігши свою назву, став одним з продуктів оновленій компанії.

Для розробки мобільних веб-додатків створено спеціальний фреймворк Sencha Touch, який підтримує більшість сучасних мобільних операційних систем.

jQuery – популярна JavaScript-бібліотека з відкритим сирцевим кодом.

Початковий код (англ. source code; також перекладається українською як вихідний код, програмний код, джерельний код, первинний код, текст програми, у професійному середовищі також сирцевий код, у контексті код або сирці) - будь-який набір інструкцій або оголошень, написаних комп'ютерною мовою програмування у формі, що її може прочитати і модифікувати людина.
Вона була представлена у січні 2006 року у BarCamp NYC Джоном Ресіґом (John Resig). Згідно з дослідженнями організації W3Techs, JQuery використовується понад половиною від мільйона найвідвідуваніших сайтів. jQuery є найпопулярнішою бібліотекою JavaScript, яка посилено використовується на сьогоднішній день.

jQuery є вільним програмним забезпеченням під ліцензією MIT (до вересня 2012 було подвійне ліцензування під MIT та GNU General Public License другої версії) [13].

Синтаксис jQuery розроблений, щоб зробити орієнтування у навігації зручнішим завдяки вибору елементів DOM, створенню анімації, обробки подій, і розробки AJAX-застосунків. jQuery також надає можливості для розробників, для створення плагінів у верхній частині бібліотеки JavaScript. Використовуючи ці об'єкти, розробники можуть створювати абстракції для низькорівневої взаємодії та створювати анімацію для ефектів високого рівня. Це сприяє створенню потужних і динамічних веб-сторінок.

Yahoo! UI Library (Yahoo! User Interface, YUI) – бібліотека JavaScript для створення насичених інтерактивними можливостями застосунків та користувацьких інтерфейсів. Використовує AJAX, анімацію, надбудови над XMLHttpRequest і DOM, drag-and-drop, слайдери, слайди, календарі, дерева, таби та інші елементи Web 2.0. Включає власне API для роботи з JavaScript, детальну документацію з прикладами.

Каркас YUI застосовується на сайтах Yahoo!, в тому числі в поштовій службі Yahoo! Mail. Сирцевий код бібліотеки поширюється на умовах ліцензії BSD.

MooTools – це вільне ПЗ JavaScript фреймворк для розробки кросбраузерних веб-програм та веб-сервісів.

Веб-служба, вебсервіс (англ. web service) - програмна система, що ідентифікується URI, та публічні інтерфейси та прив'язки якої визначені та описані мовою XML. Опис цієї програмної системи може бути знайдено іншими програмними системами які можуть взаємодіяти з нею відповідно до цього опису з використанням повідомлень, що базуються на XML та передаються за допомогою інтернет-протоколів.

MooTools є модульним, об'єктно-орієнтованим фреймворком, створеним для допомоги досвідченим розробникам JavaScript. Він дозволяє писати потужний, гнучкий і кросбраузерний код завдяки елегантному, добре документованому та послідовному API.

MooTools сумісний і протестований з браузерами: Safari 2 , Internet Explorer 6 , Firefox 2 (та іншими, основаними на рушії «Gecko»), Opera 9 .

Також, відомим фреймворком для розробки веб-додатків є Vanilla JS. Він є найбільш легким каркасом, що доступний в будь-якому місці. Браузери користувачів по замовчуванню мають завантажений в пам’ять Vanilla JS, тому він доступний навіть перед тим як сайт запитає його.

Швидкість виконання операції вибірки елемента з використанням Vanilla JS у порівнянні з іншими популярними бібліотеками наведено у таблиці 2.1.
Таблиця 2.1 – Порівння швидкості виконання операції вибірки

Фреймворк

Код

Операцій в секунду

Vanilla JS

document.getElementById('test-table')

12,137,211

Dojo

dojo.byId('test-table');

5,443,343

Prototype JS

$('test-table')

2,940,734

Ext JS

Ext.get('test-table');

997,562

jQuery

('#test-table');

350,557

YUI

YAHOO.util.Dom.get('test-table');

326,534

MooTools

document.id('test-table');

78,802

Отже, в ході варіантного аналізу засобів розробки, було обрано фреймворк Vanilla JS тому, що він є найшвидшим, підтримується усіма браузерами і не потребує попереднього завантаження.



1   ...   4   5   6   7   8   9   10   11   ...   16



  • Instagram і спільнотою
  • Internet Explorer
  • IceWeasel