Jak stworzyć aplikację RequireJS Modular, np. Pobierać pliki z dowolnego miejsca, nie za jednym razem - javascript, angularjs, performance, requirejs

Pracuję nad ogromną aplikacją internetową (AngularJS iRequireJS), w którym znajduje się wiele plików JS. (Tyle kontrolerów, filtrów, usług i tyle wtyczek innych firm). Problem, z którym się spotykam, polega na tym, że moja aplikacja zajmuje zbyt dużo czasu, aby pobrać wszystkie pliki (jednocześnie) przy każdym odświeżaniu aplikacji. Czy możemy zastosować dowolną strategię, według której skonfigurujemy nasz wymagany JS w taki sposób, że tylko wszystkie wymagane pliki powinny być pobierane zamiast wszystkich plików?

Obecnie moja Wymagana JS jest skonfigurowana w ten sposób:

reqire.config({
paths: {
angular: "../../",
jquery: "../../", .......
}, shim: {
bootstrap: {
deps: ["jquery"]
}.........................
});

Odpowiedzi:

Możesz także spojrzeć na ocLazyLoad pod kątem leniwych potrzeb związanych z ładowaniem- połączyć

Jedną strategią jest wymaganie ładowania wtyczekw wywołaniu Resolve ui-routera. Spowoduje to załadowanie wymaganych zależności dla widoku / stanu przed próbą przejścia do niego, i jest świadomy obietnicy, aby upewnić się, że wszystko ładuje się we właściwej kolejności.

.state("myState", {
url: "/myState",
template: "<div ui-view class="fade-in"></div>",
resolve: {
deps: ["$ocLazyLoad",
function( $ocLazyLoad ){
return $ocLazyLoad.load(["scripts/controllers/myController.js"]);
}]
}
})

Możesz także użyć go do załadowania wielu plików, jeśli tego potrzebujesz.

.state("ui.map.google", {
url: "/google",
templateUrl: "views/ui/map/google.html",
controller: "GoogleMapCtrl",
resolve: {
deps: ["$ocLazyLoad",
function( $ocLazyLoad ){
return $ocLazyLoad.load( [
{
files: ["vendor/jquery/load-google-maps.js",
"scripts/controllers/googlemap.js"]
},
{
name:"ui.map",
files:["vendor/modules/angular-ui-map/ui-map.js"]
}
]).then(
function(){
return loadGoogleMaps();
}
)
}]
}
})

Nie musisz robić nic specjalnego w kontrolerze, aby to działało, a wtyczka ocLazyLoad jest bardzo konfigurowalna (możesz skonfigurować manifesty / pakiety itp.).