@tramvai/module-render 5.50.0 → 5.53.78
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/browser.js +1 -12
- package/lib/resourcesInliner/resourcesInliner.es.js +71 -67
- package/lib/resourcesInliner/resourcesInliner.js +71 -67
- package/lib/resourcesRegistry/index.es.js +2 -1
- package/lib/resourcesRegistry/index.js +2 -1
- package/lib/server/PageBuilder.d.ts +3 -3
- package/lib/server/PageBuilder.es.js +21 -6
- package/lib/server/PageBuilder.js +21 -6
- package/lib/server/ReactRenderServer.es.js +15 -1
- package/lib/server/ReactRenderServer.js +15 -1
- package/lib/server/blocks/bundleResource/bundleResource.d.ts +2 -2
- package/lib/server/blocks/bundleResource/bundleResource.es.js +42 -7
- package/lib/server/blocks/bundleResource/bundleResource.js +42 -7
- package/lib/server/blocks/polyfill.d.ts +1 -2
- package/lib/server/blocks/polyfill.es.js +18 -6
- package/lib/server/blocks/polyfill.js +18 -6
- package/lib/server/blocks/utils/fetchWebpackRuntime.d.ts +2 -0
- package/lib/server/blocks/utils/fetchWebpackRuntime.es.js +16 -0
- package/lib/server/blocks/utils/fetchWebpackRuntime.js +24 -0
- package/lib/server/blocks/utils/fetchWebpackStats.es.js +13 -17
- package/lib/server/blocks/utils/fetchWebpackStats.js +13 -17
- package/lib/server/blocks/utils/flushFiles.d.ts +2 -1
- package/lib/server/blocks/utils/flushFiles.es.js +5 -2
- package/lib/server/blocks/utils/flushFiles.js +5 -2
- package/lib/server/constants/slots.d.ts +1 -0
- package/lib/server/htmlPageSchema.es.js +2 -1
- package/lib/server/htmlPageSchema.js +2 -1
- package/lib/server.es.js +7 -37
- package/lib/server.js +5 -35
- package/package.json +20 -20
- package/tests.js +3 -1
package/lib/browser.js
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { __decorate } from 'tslib';
|
|
2
2
|
import { Module, provide, commandLineListTokens, DI_TOKEN, optional } from '@tramvai/core';
|
|
3
3
|
import { STORE_TOKEN, LOGGER_TOKEN, CONTEXT_TOKEN } from '@tramvai/tokens-common';
|
|
4
|
-
import { RESOURCES_REGISTRY, CUSTOM_RENDER, EXTEND_RENDER, RENDERER_CALLBACK, USE_REACT_STRICT_MODE, REACT_SERVER_RENDER_MODE, DEFAULT_ERROR_BOUNDARY_COMPONENT, RENDER_MODE
|
|
4
|
+
import { RESOURCES_REGISTRY, CUSTOM_RENDER, EXTEND_RENDER, RENDERER_CALLBACK, USE_REACT_STRICT_MODE, REACT_SERVER_RENDER_MODE, DEFAULT_ERROR_BOUNDARY_COMPONENT, RENDER_MODE } from '@tramvai/tokens-render';
|
|
5
5
|
export * from '@tramvai/tokens-render';
|
|
6
6
|
import { beforeResolveHooksToken, PageErrorStore, setPageErrorEvent } from '@tramvai/module-router';
|
|
7
7
|
export { PageErrorStore, setPageErrorEvent } from '@tramvai/module-router';
|
|
8
|
-
import { COOKIE_MANAGER_TOKEN } from '@tramvai/module-common';
|
|
9
8
|
import { rendering } from './client/index.browser.js';
|
|
10
9
|
import { LayoutModule } from './shared/LayoutModule.browser.js';
|
|
11
10
|
import { providers } from './shared/providers.browser.js';
|
|
@@ -110,16 +109,6 @@ RenderModule = RenderModule_1 = __decorate([
|
|
|
110
109
|
provide: RENDER_MODE,
|
|
111
110
|
useValue: 'legacy',
|
|
112
111
|
}),
|
|
113
|
-
provide({
|
|
114
|
-
provide: MODERN_SATISFIES_TOKEN,
|
|
115
|
-
useFactory: ({ cookieManager }) => {
|
|
116
|
-
const result = cookieManager.get('_t_modern');
|
|
117
|
-
return result === 'true' || result === 'false' ? JSON.parse(result) : false;
|
|
118
|
-
},
|
|
119
|
-
deps: {
|
|
120
|
-
cookieManager: COOKIE_MANAGER_TOKEN,
|
|
121
|
-
},
|
|
122
|
-
}),
|
|
123
112
|
provide({
|
|
124
113
|
provide: REACT_SERVER_RENDER_MODE,
|
|
125
114
|
useValue: 'sync',
|
|
@@ -31,80 +31,84 @@ const removeSourceMapFromString = (file) => {
|
|
|
31
31
|
return file.replace(/(\n\/\/# sourceMappingURL=.*)/g, '');
|
|
32
32
|
};
|
|
33
33
|
class ResourcesInliner {
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
filesCache.set(url, processFile(resource, file));
|
|
56
|
-
}
|
|
57
|
-
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
58
|
-
}
|
|
59
|
-
catch (error) {
|
|
60
|
-
this.log.warn({
|
|
61
|
-
event: 'file-load-failed',
|
|
62
|
-
url,
|
|
63
|
-
error,
|
|
64
|
-
});
|
|
34
|
+
resourceInlineThreshold;
|
|
35
|
+
internalFilesCache = new Map();
|
|
36
|
+
resourcesRegistryCache;
|
|
37
|
+
log;
|
|
38
|
+
runningRequests = new Set();
|
|
39
|
+
assetsPrefix;
|
|
40
|
+
scheduleFileLoad = async (resource, resourceInlineThreshold) => {
|
|
41
|
+
const url = getResourceUrl(resource, this.assetsPrefix);
|
|
42
|
+
const requestKey = `file${url}`;
|
|
43
|
+
const filesCache = this.getFilesCache(url);
|
|
44
|
+
const result = filesCache.get(url);
|
|
45
|
+
if (result) {
|
|
46
|
+
return result;
|
|
47
|
+
}
|
|
48
|
+
if (!this.runningRequests.has(requestKey)) {
|
|
49
|
+
this.runningRequests.add(url);
|
|
50
|
+
try {
|
|
51
|
+
const file = await getFile(url);
|
|
52
|
+
if (file === undefined) {
|
|
53
|
+
this.resourcesRegistryCache.disabledUrlsCache.set(url, true);
|
|
54
|
+
return;
|
|
65
55
|
}
|
|
66
|
-
|
|
67
|
-
|
|
56
|
+
const size = file.length;
|
|
57
|
+
if (size < resourceInlineThreshold) {
|
|
58
|
+
filesCache.set(url, processFile(resource, file));
|
|
68
59
|
}
|
|
60
|
+
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
69
61
|
}
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
return result;
|
|
62
|
+
catch (error) {
|
|
63
|
+
this.log.warn({
|
|
64
|
+
event: 'file-load-failed',
|
|
65
|
+
url,
|
|
66
|
+
error,
|
|
67
|
+
});
|
|
77
68
|
}
|
|
78
|
-
|
|
79
|
-
this.runningRequests.
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
this.log.debug({
|
|
98
|
-
event: 'file-content-length-load-failed',
|
|
99
|
-
url,
|
|
100
|
-
error,
|
|
101
|
-
});
|
|
69
|
+
finally {
|
|
70
|
+
this.runningRequests.delete(requestKey);
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
scheduleFileSizeLoad = async (resource, resourceInlineThreshold, waitForFileLoad) => {
|
|
75
|
+
const url = getResourceUrl(resource, this.assetsPrefix);
|
|
76
|
+
const requestKey = `size${url}`;
|
|
77
|
+
const result = this.resourcesRegistryCache.sizeCache.get(url);
|
|
78
|
+
if (result) {
|
|
79
|
+
return result;
|
|
80
|
+
}
|
|
81
|
+
if (!this.runningRequests.has(requestKey)) {
|
|
82
|
+
this.runningRequests.add(requestKey);
|
|
83
|
+
try {
|
|
84
|
+
const contentLength = await getFileContentLength(url);
|
|
85
|
+
const size = isUndefined(contentLength) ? 0 : +contentLength;
|
|
86
|
+
if (size) {
|
|
87
|
+
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
102
88
|
}
|
|
103
|
-
|
|
104
|
-
this.
|
|
89
|
+
if (size < resourceInlineThreshold) {
|
|
90
|
+
const promise = this.scheduleFileLoad(resource, resourceInlineThreshold);
|
|
91
|
+
if (waitForFileLoad) {
|
|
92
|
+
await promise;
|
|
93
|
+
}
|
|
105
94
|
}
|
|
106
95
|
}
|
|
107
|
-
|
|
96
|
+
catch (error) {
|
|
97
|
+
// If the ASSETS_PREFIX variable does not exist,
|
|
98
|
+
// or static files weren't deployed yet, we can't get
|
|
99
|
+
// information about files.
|
|
100
|
+
this.log.debug({
|
|
101
|
+
event: 'file-content-length-load-failed',
|
|
102
|
+
url,
|
|
103
|
+
error,
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
finally {
|
|
107
|
+
this.runningRequests.delete(requestKey);
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
};
|
|
111
|
+
constructor({ resourcesRegistryCache, resourceInlineThreshold, logger, assetsPrefixFactory }) {
|
|
108
112
|
this.resourcesRegistryCache = resourcesRegistryCache;
|
|
109
113
|
this.resourceInlineThreshold = resourceInlineThreshold;
|
|
110
114
|
this.log = logger('resources-inliner');
|
|
@@ -40,80 +40,84 @@ const removeSourceMapFromString = (file) => {
|
|
|
40
40
|
return file.replace(/(\n\/\/# sourceMappingURL=.*)/g, '');
|
|
41
41
|
};
|
|
42
42
|
class ResourcesInliner {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
filesCache.set(url, fileProcessor.processFile(resource, file));
|
|
65
|
-
}
|
|
66
|
-
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
67
|
-
}
|
|
68
|
-
catch (error) {
|
|
69
|
-
this.log.warn({
|
|
70
|
-
event: 'file-load-failed',
|
|
71
|
-
url,
|
|
72
|
-
error,
|
|
73
|
-
});
|
|
43
|
+
resourceInlineThreshold;
|
|
44
|
+
internalFilesCache = new Map();
|
|
45
|
+
resourcesRegistryCache;
|
|
46
|
+
log;
|
|
47
|
+
runningRequests = new Set();
|
|
48
|
+
assetsPrefix;
|
|
49
|
+
scheduleFileLoad = async (resource, resourceInlineThreshold) => {
|
|
50
|
+
const url = getResourceUrl(resource, this.assetsPrefix);
|
|
51
|
+
const requestKey = `file${url}`;
|
|
52
|
+
const filesCache = this.getFilesCache(url);
|
|
53
|
+
const result = filesCache.get(url);
|
|
54
|
+
if (result) {
|
|
55
|
+
return result;
|
|
56
|
+
}
|
|
57
|
+
if (!this.runningRequests.has(requestKey)) {
|
|
58
|
+
this.runningRequests.add(url);
|
|
59
|
+
try {
|
|
60
|
+
const file = await externalFilesHelper.getFile(url);
|
|
61
|
+
if (file === undefined) {
|
|
62
|
+
this.resourcesRegistryCache.disabledUrlsCache.set(url, true);
|
|
63
|
+
return;
|
|
74
64
|
}
|
|
75
|
-
|
|
76
|
-
|
|
65
|
+
const size = file.length;
|
|
66
|
+
if (size < resourceInlineThreshold) {
|
|
67
|
+
filesCache.set(url, fileProcessor.processFile(resource, file));
|
|
77
68
|
}
|
|
69
|
+
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
78
70
|
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
return result;
|
|
71
|
+
catch (error) {
|
|
72
|
+
this.log.warn({
|
|
73
|
+
event: 'file-load-failed',
|
|
74
|
+
url,
|
|
75
|
+
error,
|
|
76
|
+
});
|
|
86
77
|
}
|
|
87
|
-
|
|
88
|
-
this.runningRequests.
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
this.log.debug({
|
|
107
|
-
event: 'file-content-length-load-failed',
|
|
108
|
-
url,
|
|
109
|
-
error,
|
|
110
|
-
});
|
|
78
|
+
finally {
|
|
79
|
+
this.runningRequests.delete(requestKey);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
scheduleFileSizeLoad = async (resource, resourceInlineThreshold, waitForFileLoad) => {
|
|
84
|
+
const url = getResourceUrl(resource, this.assetsPrefix);
|
|
85
|
+
const requestKey = `size${url}`;
|
|
86
|
+
const result = this.resourcesRegistryCache.sizeCache.get(url);
|
|
87
|
+
if (result) {
|
|
88
|
+
return result;
|
|
89
|
+
}
|
|
90
|
+
if (!this.runningRequests.has(requestKey)) {
|
|
91
|
+
this.runningRequests.add(requestKey);
|
|
92
|
+
try {
|
|
93
|
+
const contentLength = await externalFilesHelper.getFileContentLength(url);
|
|
94
|
+
const size = isUndefined__default["default"](contentLength) ? 0 : +contentLength;
|
|
95
|
+
if (size) {
|
|
96
|
+
this.resourcesRegistryCache.sizeCache.set(url, size);
|
|
111
97
|
}
|
|
112
|
-
|
|
113
|
-
this.
|
|
98
|
+
if (size < resourceInlineThreshold) {
|
|
99
|
+
const promise = this.scheduleFileLoad(resource, resourceInlineThreshold);
|
|
100
|
+
if (waitForFileLoad) {
|
|
101
|
+
await promise;
|
|
102
|
+
}
|
|
114
103
|
}
|
|
115
104
|
}
|
|
116
|
-
|
|
105
|
+
catch (error) {
|
|
106
|
+
// If the ASSETS_PREFIX variable does not exist,
|
|
107
|
+
// or static files weren't deployed yet, we can't get
|
|
108
|
+
// information about files.
|
|
109
|
+
this.log.debug({
|
|
110
|
+
event: 'file-content-length-load-failed',
|
|
111
|
+
url,
|
|
112
|
+
error,
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
finally {
|
|
116
|
+
this.runningRequests.delete(requestKey);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
constructor({ resourcesRegistryCache, resourceInlineThreshold, logger, assetsPrefixFactory }) {
|
|
117
121
|
this.resourcesRegistryCache = resourcesRegistryCache;
|
|
118
122
|
this.resourceInlineThreshold = resourceInlineThreshold;
|
|
119
123
|
this.log = logger('resources-inliner');
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import toArray from '@tinkoff/utils/array/toArray';
|
|
2
2
|
|
|
3
3
|
class ResourcesRegistry {
|
|
4
|
+
resources = new Set();
|
|
5
|
+
resourceInliner;
|
|
4
6
|
constructor({ resourceInliner }) {
|
|
5
|
-
this.resources = new Set();
|
|
6
7
|
this.resourceInliner = resourceInliner;
|
|
7
8
|
}
|
|
8
9
|
register(resourceOrResources) {
|
|
@@ -9,8 +9,9 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
9
9
|
var toArray__default = /*#__PURE__*/_interopDefaultLegacy(toArray);
|
|
10
10
|
|
|
11
11
|
class ResourcesRegistry {
|
|
12
|
+
resources = new Set();
|
|
13
|
+
resourceInliner;
|
|
12
14
|
constructor({ resourceInliner }) {
|
|
13
|
-
this.resources = new Set();
|
|
14
15
|
this.resourceInliner = resourceInliner;
|
|
15
16
|
}
|
|
16
17
|
register(resourceOrResources) {
|
|
@@ -9,14 +9,14 @@ export declare class PageBuilder {
|
|
|
9
9
|
private reactRender;
|
|
10
10
|
private htmlAttrs;
|
|
11
11
|
private polyfillCondition;
|
|
12
|
-
private modern;
|
|
13
12
|
private renderFlowAfter;
|
|
14
13
|
private log;
|
|
15
14
|
private fetchWebpackStats;
|
|
15
|
+
private inlineWebpackRuntime;
|
|
16
16
|
private di;
|
|
17
17
|
private renderMode;
|
|
18
18
|
private assetsPrefixFactory;
|
|
19
|
-
constructor({ renderSlots, pageService, resourcesRegistry, context, reactRender, htmlPageSchema, polyfillCondition, htmlAttrs,
|
|
19
|
+
constructor({ renderSlots, pageService, resourcesRegistry, context, reactRender, htmlPageSchema, polyfillCondition, htmlAttrs, renderFlowAfter, logger, fetchWebpackStats, inlineWebpackRuntime, di, renderMode, assetsPrefixFactory, }: {
|
|
20
20
|
renderSlots: any;
|
|
21
21
|
pageService: any;
|
|
22
22
|
resourcesRegistry: any;
|
|
@@ -25,10 +25,10 @@ export declare class PageBuilder {
|
|
|
25
25
|
htmlPageSchema: any;
|
|
26
26
|
polyfillCondition: any;
|
|
27
27
|
htmlAttrs: any;
|
|
28
|
-
modern: any;
|
|
29
28
|
renderFlowAfter: any;
|
|
30
29
|
logger: any;
|
|
31
30
|
fetchWebpackStats: any;
|
|
31
|
+
inlineWebpackRuntime: any;
|
|
32
32
|
di: any;
|
|
33
33
|
renderMode: any;
|
|
34
34
|
assetsPrefixFactory: any;
|
|
@@ -20,7 +20,22 @@ const mapResourcesToSlots = (resources) => resources.reduce((acc, resource) => {
|
|
|
20
20
|
return acc;
|
|
21
21
|
}, {});
|
|
22
22
|
class PageBuilder {
|
|
23
|
-
|
|
23
|
+
resourcesRegistry;
|
|
24
|
+
pageService;
|
|
25
|
+
// eslint-disable-next-line react/static-property-placement
|
|
26
|
+
context;
|
|
27
|
+
htmlPageSchema;
|
|
28
|
+
reactRender;
|
|
29
|
+
htmlAttrs;
|
|
30
|
+
polyfillCondition;
|
|
31
|
+
renderFlowAfter;
|
|
32
|
+
log;
|
|
33
|
+
fetchWebpackStats;
|
|
34
|
+
inlineWebpackRuntime;
|
|
35
|
+
di;
|
|
36
|
+
renderMode;
|
|
37
|
+
assetsPrefixFactory;
|
|
38
|
+
constructor({ renderSlots, pageService, resourcesRegistry, context, reactRender, htmlPageSchema, polyfillCondition, htmlAttrs, renderFlowAfter, logger, fetchWebpackStats, inlineWebpackRuntime, di, renderMode, assetsPrefixFactory, }) {
|
|
24
39
|
this.htmlAttrs = htmlAttrs;
|
|
25
40
|
this.renderSlots = flatten(renderSlots || []);
|
|
26
41
|
this.pageService = pageService;
|
|
@@ -29,16 +44,16 @@ class PageBuilder {
|
|
|
29
44
|
this.reactRender = reactRender;
|
|
30
45
|
this.htmlPageSchema = htmlPageSchema;
|
|
31
46
|
this.polyfillCondition = polyfillCondition;
|
|
32
|
-
this.modern = modern;
|
|
33
47
|
this.renderFlowAfter = renderFlowAfter || [];
|
|
34
48
|
this.log = logger('page-builder');
|
|
35
49
|
this.fetchWebpackStats = fetchWebpackStats;
|
|
50
|
+
this.inlineWebpackRuntime = inlineWebpackRuntime;
|
|
36
51
|
this.di = di;
|
|
37
52
|
this.renderMode = renderMode;
|
|
38
53
|
this.assetsPrefixFactory = assetsPrefixFactory;
|
|
39
54
|
}
|
|
40
55
|
async flow() {
|
|
41
|
-
const stats = await this.fetchWebpackStats(
|
|
56
|
+
const stats = await this.fetchWebpackStats();
|
|
42
57
|
const extractor = new ChunkExtractor({ stats, entrypoints: [] });
|
|
43
58
|
// first we render the application, because we need to extract information about the data used by the components
|
|
44
59
|
await this.renderApp({ extractor, stats });
|
|
@@ -76,20 +91,19 @@ class PageBuilder {
|
|
|
76
91
|
});
|
|
77
92
|
}
|
|
78
93
|
async fetchChunksInfo(extractor) {
|
|
79
|
-
const {
|
|
94
|
+
const { renderMode } = this;
|
|
80
95
|
const { bundle, pageComponent } = this.pageService.getConfig();
|
|
81
96
|
this.resourcesRegistry.register(await bundleResource({
|
|
82
97
|
bundle,
|
|
83
|
-
modern,
|
|
84
98
|
extractor,
|
|
85
99
|
pageComponent,
|
|
86
100
|
fetchWebpackStats: this.fetchWebpackStats,
|
|
101
|
+
inlineWebpackRuntime: this.inlineWebpackRuntime,
|
|
87
102
|
renderMode: this.renderMode,
|
|
88
103
|
assetsPrefixFactory: this.assetsPrefixFactory,
|
|
89
104
|
}));
|
|
90
105
|
this.resourcesRegistry.register(await polyfillResources({
|
|
91
106
|
condition: this.polyfillCondition,
|
|
92
|
-
modern,
|
|
93
107
|
fetchWebpackStats: this.fetchWebpackStats,
|
|
94
108
|
renderMode,
|
|
95
109
|
}));
|
|
@@ -113,6 +127,7 @@ class PageBuilder {
|
|
|
113
127
|
description: this.htmlPageSchema,
|
|
114
128
|
});
|
|
115
129
|
}
|
|
130
|
+
renderSlots;
|
|
116
131
|
async renderApp({ extractor, stats }) {
|
|
117
132
|
const html = await this.reactRender.render({ extractor, stats });
|
|
118
133
|
const appHtmlAttrs = formatAttributes(this.htmlAttrs, 'app');
|
|
@@ -28,7 +28,22 @@ const mapResourcesToSlots = (resources) => resources.reduce((acc, resource) => {
|
|
|
28
28
|
return acc;
|
|
29
29
|
}, {});
|
|
30
30
|
class PageBuilder {
|
|
31
|
-
|
|
31
|
+
resourcesRegistry;
|
|
32
|
+
pageService;
|
|
33
|
+
// eslint-disable-next-line react/static-property-placement
|
|
34
|
+
context;
|
|
35
|
+
htmlPageSchema;
|
|
36
|
+
reactRender;
|
|
37
|
+
htmlAttrs;
|
|
38
|
+
polyfillCondition;
|
|
39
|
+
renderFlowAfter;
|
|
40
|
+
log;
|
|
41
|
+
fetchWebpackStats;
|
|
42
|
+
inlineWebpackRuntime;
|
|
43
|
+
di;
|
|
44
|
+
renderMode;
|
|
45
|
+
assetsPrefixFactory;
|
|
46
|
+
constructor({ renderSlots, pageService, resourcesRegistry, context, reactRender, htmlPageSchema, polyfillCondition, htmlAttrs, renderFlowAfter, logger, fetchWebpackStats, inlineWebpackRuntime, di, renderMode, assetsPrefixFactory, }) {
|
|
32
47
|
this.htmlAttrs = htmlAttrs;
|
|
33
48
|
this.renderSlots = flatten__default["default"](renderSlots || []);
|
|
34
49
|
this.pageService = pageService;
|
|
@@ -37,16 +52,16 @@ class PageBuilder {
|
|
|
37
52
|
this.reactRender = reactRender;
|
|
38
53
|
this.htmlPageSchema = htmlPageSchema;
|
|
39
54
|
this.polyfillCondition = polyfillCondition;
|
|
40
|
-
this.modern = modern;
|
|
41
55
|
this.renderFlowAfter = renderFlowAfter || [];
|
|
42
56
|
this.log = logger('page-builder');
|
|
43
57
|
this.fetchWebpackStats = fetchWebpackStats;
|
|
58
|
+
this.inlineWebpackRuntime = inlineWebpackRuntime;
|
|
44
59
|
this.di = di;
|
|
45
60
|
this.renderMode = renderMode;
|
|
46
61
|
this.assetsPrefixFactory = assetsPrefixFactory;
|
|
47
62
|
}
|
|
48
63
|
async flow() {
|
|
49
|
-
const stats = await this.fetchWebpackStats(
|
|
64
|
+
const stats = await this.fetchWebpackStats();
|
|
50
65
|
const extractor = new server.ChunkExtractor({ stats, entrypoints: [] });
|
|
51
66
|
// first we render the application, because we need to extract information about the data used by the components
|
|
52
67
|
await this.renderApp({ extractor, stats });
|
|
@@ -84,20 +99,19 @@ class PageBuilder {
|
|
|
84
99
|
});
|
|
85
100
|
}
|
|
86
101
|
async fetchChunksInfo(extractor) {
|
|
87
|
-
const {
|
|
102
|
+
const { renderMode } = this;
|
|
88
103
|
const { bundle, pageComponent } = this.pageService.getConfig();
|
|
89
104
|
this.resourcesRegistry.register(await bundleResource.bundleResource({
|
|
90
105
|
bundle,
|
|
91
|
-
modern,
|
|
92
106
|
extractor,
|
|
93
107
|
pageComponent,
|
|
94
108
|
fetchWebpackStats: this.fetchWebpackStats,
|
|
109
|
+
inlineWebpackRuntime: this.inlineWebpackRuntime,
|
|
95
110
|
renderMode: this.renderMode,
|
|
96
111
|
assetsPrefixFactory: this.assetsPrefixFactory,
|
|
97
112
|
}));
|
|
98
113
|
this.resourcesRegistry.register(await polyfill.polyfillResources({
|
|
99
114
|
condition: this.polyfillCondition,
|
|
100
|
-
modern,
|
|
101
115
|
fetchWebpackStats: this.fetchWebpackStats,
|
|
102
116
|
renderMode,
|
|
103
117
|
}));
|
|
@@ -121,6 +135,7 @@ class PageBuilder {
|
|
|
121
135
|
description: this.htmlPageSchema,
|
|
122
136
|
});
|
|
123
137
|
}
|
|
138
|
+
renderSlots;
|
|
124
139
|
async renderApp({ extractor, stats }) {
|
|
125
140
|
const html = await this.reactRender.render({ extractor, stats });
|
|
126
141
|
const appHtmlAttrs = utils.formatAttributes(this.htmlAttrs, 'app');
|
|
@@ -5,9 +5,13 @@ import { renderReact } from '../react/index.es.js';
|
|
|
5
5
|
import { flushFiles } from './blocks/utils/flushFiles.es.js';
|
|
6
6
|
|
|
7
7
|
class HtmlWritable extends Writable {
|
|
8
|
+
responseTaskManager;
|
|
9
|
+
responseStream;
|
|
10
|
+
extractor;
|
|
11
|
+
stats;
|
|
12
|
+
alreadySentChunks = null;
|
|
8
13
|
constructor({ responseTaskManager, responseStream, extractor, stats, }) {
|
|
9
14
|
super();
|
|
10
|
-
this.alreadySentChunks = null;
|
|
11
15
|
this.responseTaskManager = responseTaskManager;
|
|
12
16
|
this.responseStream = responseStream;
|
|
13
17
|
this.extractor = extractor;
|
|
@@ -64,6 +68,16 @@ const Deferred = () => {
|
|
|
64
68
|
return { promise, resolve, reject };
|
|
65
69
|
};
|
|
66
70
|
class ReactRenderServer {
|
|
71
|
+
customRender;
|
|
72
|
+
extendRender;
|
|
73
|
+
context;
|
|
74
|
+
deferredActions;
|
|
75
|
+
di;
|
|
76
|
+
log;
|
|
77
|
+
responseTaskManager;
|
|
78
|
+
responseStream;
|
|
79
|
+
streamingTimeout;
|
|
80
|
+
renderMode;
|
|
67
81
|
// eslint-disable-next-line sort-class-members/sort-class-members
|
|
68
82
|
constructor({ context, customRender, extendRender, di, renderMode, logger, responseTaskManager, responseStream, streamingTimeout, deferredActions, }) {
|
|
69
83
|
this.context = context;
|
|
@@ -13,9 +13,13 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
13
13
|
var each__default = /*#__PURE__*/_interopDefaultLegacy(each);
|
|
14
14
|
|
|
15
15
|
class HtmlWritable extends stream.Writable {
|
|
16
|
+
responseTaskManager;
|
|
17
|
+
responseStream;
|
|
18
|
+
extractor;
|
|
19
|
+
stats;
|
|
20
|
+
alreadySentChunks = null;
|
|
16
21
|
constructor({ responseTaskManager, responseStream, extractor, stats, }) {
|
|
17
22
|
super();
|
|
18
|
-
this.alreadySentChunks = null;
|
|
19
23
|
this.responseTaskManager = responseTaskManager;
|
|
20
24
|
this.responseStream = responseStream;
|
|
21
25
|
this.extractor = extractor;
|
|
@@ -72,6 +76,16 @@ const Deferred = () => {
|
|
|
72
76
|
return { promise, resolve, reject };
|
|
73
77
|
};
|
|
74
78
|
class ReactRenderServer {
|
|
79
|
+
customRender;
|
|
80
|
+
extendRender;
|
|
81
|
+
context;
|
|
82
|
+
deferredActions;
|
|
83
|
+
di;
|
|
84
|
+
log;
|
|
85
|
+
responseTaskManager;
|
|
86
|
+
responseStream;
|
|
87
|
+
streamingTimeout;
|
|
88
|
+
renderMode;
|
|
75
89
|
// eslint-disable-next-line sort-class-members/sort-class-members
|
|
76
90
|
constructor({ context, customRender, extendRender, di, renderMode, logger, responseTaskManager, responseStream, streamingTimeout, deferredActions, }) {
|
|
77
91
|
this.context = context;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import type { ChunkExtractor } from '@loadable/server';
|
|
2
2
|
import type { PageResource, FETCH_WEBPACK_STATS_TOKEN, REACT_SERVER_RENDER_MODE, ASSETS_PREFIX_TOKEN } from '@tramvai/tokens-render';
|
|
3
3
|
import type { ExtractDependencyType } from '@tinkoff/dippy';
|
|
4
|
-
export declare const bundleResource: ({ bundle,
|
|
4
|
+
export declare const bundleResource: ({ bundle, extractor, pageComponent, fetchWebpackStats, inlineWebpackRuntime, renderMode, assetsPrefixFactory, }: {
|
|
5
5
|
bundle: string;
|
|
6
|
-
modern: boolean;
|
|
7
6
|
extractor: ChunkExtractor;
|
|
8
7
|
pageComponent?: string;
|
|
9
8
|
fetchWebpackStats: typeof FETCH_WEBPACK_STATS_TOKEN;
|
|
9
|
+
inlineWebpackRuntime: boolean;
|
|
10
10
|
renderMode: typeof REACT_SERVER_RENDER_MODE | null;
|
|
11
11
|
assetsPrefixFactory: ExtractDependencyType<typeof ASSETS_PREFIX_TOKEN>;
|
|
12
12
|
}) => Promise<PageResource[]>;
|