Download as PDF, PPTX
![INTEGRATION
angular.element(document).ready(function() {
angular.bootstrap(document, ['myApp']);
});](https://image.slidesharecdn.com/1pleshivtsev-150412232952-conversion-gate01/75/frontend-18-2048.jpg)
![MODULE SYSTEM
angular.module('myApp', [])
.controller('MyController', ['$scope', function ($scope) {
$scope.greetMe = 'World';
}]);](https://image.slidesharecdn.com/1pleshivtsev-150412232952-conversion-gate01/75/frontend-20-2048.jpg)
Uploaded byCodeFest
Лучший frontend-фреймворк, и почему вы его не хотите
Документ исследует использование AngularJS в приложениях, обсуждая его архитектуру, функциональность и ограничения. Описаны различные аспекты, такие как интеграция, гибкость и оптимизация производительности, а также сравнение с другими технологиями, такими как React и ClojureScript. Выводы подчеркивают важность понимания требований к проекту перед выбором технологий.
Лучший frontend-фреймворк, и почему вы его не хотите
- 1. ГРЯЗНЫЕ ПОДРОБНОСТИ ЖИЗНИС ANGULARJS Антон Плешивцев aviasales.ru
- 2.
- 3.
- 4. ПРИЛОЖЕНИЕ • единый codestyle •одинаковый функционал
- 5. RAW JS • 20kSLOC • 10+ custom components • custom AMD • 72 h/f
- 6. BACKBONE • 15k SLOC •weak modules • 60 h/f
- 7. ANGULAR JS • 5kSLOC • DI • 4 h/f
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20. MODULE SYSTEM angular.module('myApp', []) .controller('MyController',['$scope', function ($scope) { $scope.greetMe = 'World'; }]);
- 21.
- 22.
- 23. NGROUTE $routeProvider .when('/searches/new', templateUrl: 'empty.html' controller: 'EmptyController' ) .when('/', templateUrl:'empty.html' controller: 'EmptyController' ) .when('/:encoded_search', templateUrl: 'search_results.html' controller: 'SearchResultsController' reloadOnSearch: false )
- 24.
- 25. SOLUTION • использовать форк •патчи в исходном коде • постоянный мониторинг обновлений
- 26.
- 27.
- 28.
- 29.
- 30. NG-REPEAT <div ng-repeat="(key, value)in myObj"> ... </div>
- 31. NG-REPEAT • 5000 билетов •200 значений на билет • 1 000 000 (миллион) watchers
- 32.
- 33. QUICK-NG-REPEAT TOTHE RESCUE <div quick-ng-repeat=«(key,value) in myObj"> ... </div>
- 34. QUICK-NG-REPEAT • $watchCollection ->$watch • $digest hack • handmade updates
- 35.
- 36. ANGULAR JS • внутренниеинтерфейсы (аналитика, админки) • B2B • прототипы
- 37.
- 38. REACT JS • stateful-приложение •сложный DOM • критичные к производительности приложения
- 39. CLOJURESCRIPT • сверхкритичные кскорости приложения • некритичные к размеру • команда выше среднего
- 40. HANDMADE • размер приложениякритичен • нужны низкоуровневые оптимизации • команда выше среднего
- 41.
- 42. ВЫВОДЫ • Стоит изначальнопонимать требования к проекту • AngularJS применим, но с набором ограничений • Иногда лучше попробовать что-то другое
- 43.