У меня есть приложение SSR angular, и на просмотр содержимого после ввода URL-адреса в браузере требуется до 15 секунд. Когда он запрашивает индекс. html время запроса файла выглядит следующим образом: Время для индекса. html запрос
Дополнительное время иногда выделяется в «Очереди», иногда в «Ожидании TTFB» примерно 15 сек. На этот раз это были злополучные 35-е годы. В локальной среде исправлено 15 секунд.
Я немного поискал, прочитал несколько сообщений и заметил, что это связано с Http-запросами, сделанными на стороне сервера во время сборки. Когда он не доходит до API, нет задержки и загружается в течение 1-5 секунд. Если я сделаю один запрос (даже для небольшого количества данных), сборка приложения замедлится до фиксированных 15 секунд. Я сделал несколько консольных журналов, и хотя проблема связана с HTTP-запросами, запросы не занимают много времени.
тест журналирования консоли - начало - это время ввода URL, ответ - внутренний API запрос выполнен sh время, готово - окончание сборки sh время
Обратите внимание, что ответ api приходит в течение 400 мсек, но сборка «завершена» всего через 15 секунд. Я думаю, что это может быть связано с ngZone или чем-то еще, но я этого совсем не понимаю.
Это мой tsconfig.app. json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app",
"baseUrl": "./",
"target": "es2015",
"module": "es2015",
"types": [],
"lib": ["es2017", "dom"]
},
"exclude": ["test.ts", "**/*.spec.ts"]
}
и tsconfig. server. json
{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "../out-tsc/app-server",
"baseUrl": "."
},
"exclude": ["test.ts", "**/*.spec.ts"],
"angularCompilerOptions": {
"entryModule": "app/app.server.module#AppServerModule"
}
}
и это мои зависимости:
"dependencies": {
"@angular-devkit/core": "^7.3.3",
"@angular/animations": "^7.2.7",
"@angular/cdk": "^6.0.0-rc.12",
"@angular/common": "^7.2.7",
"@angular/compiler": "^7.2.7",
"@angular/core": "^7.2.7",
"@angular/forms": "^7.2.7",
"@angular/http": "^7.2.7",
"@angular/platform-browser": "^7.2.7",
"@angular/platform-browser-dynamic": "^7.2.7",
"@angular/platform-server": "^7.2.7",
"@angular/pwa": "^0.10.7",
"@angular/router": "^7.2.7",
"@angular/service-worker": "^7.2.7",
"@fortawesome/angular-fontawesome": "^0.1.1",
"@fortawesome/fontawesome-free": "^5.7.2",
"@fortawesome/fontawesome-svg-core": "^1.2.15",
"@fortawesome/free-solid-svg-icons": "^5.7.2",
"@ng-bootstrap/ng-bootstrap": "^4.0.0",
"@ngrx/effects": "^7.3.0",
"@ngrx/store": "^7.3.0",
"@ngrx/store-devtools": "^7.3.0",
"@ngu/carousel": "^1.5.5",
"@nguniversal/express-engine": "0.0.0",
"@nguniversal/module-map-ngfactory-loader": "^8.2.6",
"@ngx-pwa/offline": "^6.1.0",
"@ngx-translate/core": "^10.0.2",
"@ngx-translate/http-loader": "^3.0.1",
"@types/cors": "^2.8.4",
"@types/express": "^4.16.1",
"@types/hammerjs": "^2.0.36",
"@types/lodash": "^4.14.121",
"add-to-homescreen": "^3.2.6",
"ajv": "^6.9.2",
"ansi-styles": "^3.2.1",
"axios": "^0.19.2",
"bootstrap-css-only": "^4.3.1",
"bootswatch": "^4.3.1",
"core-js": "^2.6.5",
"cors": "^2.8.5",
"dotenv": "^8.2.0",
"express": "^4.17.1",
"hammer-timejs": "^1.1.0",
"hammerjs": "^2.0.8",
"http-proxy-middleware": "^0.18.0",
"js-sha1": "^0.6.0",
"lazysizes": "^5.2.0",
"lodash-es": "^4.17.15",
"mobile-detect": "^1.4.3",
"mock-browser": "^0.92.14",
"mock-location": "^0.2.0",
"mysql": "^2.17.1",
"ng2-nouislider": "^1.7.13",
"ngrx-store-localstorage": "^5.1.1",
"ngx-cookie-service": "^2.1.0",
"ngx-i18nsupport": "^0.17.1",
"ngx-infinite-scroll": "^6.0.1",
"ngx-owl-carousel-o": "^1.1.7",
"ngx-pinch-zoom": "^1.2.3",
"ngx-toastr": "^10.0.4",
"node-sass": "^4.12.0",
"nouislider": "^12.1.0",
"path": "^0.12.7",
"public-holidays": "^0.2.2",
"redis": "^2.8.0",
"redis-parser": "^3.0.0",
"request": "^2.88.0",
"rxjs": "6.4.0",
"rxjs-compat": "^6.4.0",
"webpack-cli": "^3.3.10",
"winston": "^3.2.1",
"xml2js": "^0.4.19",
"zone.js": "^0.8.29"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.13.8",
"@angular/cli": "^7.3.4",
"@angular/compiler-cli": "^7.2.7",
"@angular/language-service": "^7.2.7",
"@types/dotenv": "^8.2.0",
"@types/jasmine": "^2.8.16",
"@types/jasminewd2": "~2.0.2",
"@types/mysql": "^2.15.8",
"@types/node": "~6.0.60",
"@types/redis": "^2.8.0",
"codelyzer": "^4.0.1",
"husky": "^1.3.1",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "^4.0.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.4.3",
"karma-jasmine": "^1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-viewport": "^1.0.4",
"prettier": "1.15.3",
"pretty-quick": "^1.10.0",
"protractor": "^5.4.2",
"puppeteer": "^1.16.0",
"ts-loader": "^5.2.0",
"ts-node": "^4.1.0",
"tslint": "~5.9.1",
"typescript": "3.2.4",
"webpack-bundle-analyzer": "^3.6.0"
},
"husky": {
"hooks": {
"pre-commit": "pretty-quick --staged"
}
}