@modern-js/runtime 2.0.0-beta.0 → 2.0.0-beta.2

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.
Files changed (204) hide show
  1. package/CHANGELOG.md +158 -0
  2. package/dist/js/modern/cli/index.js +6 -6
  3. package/dist/js/modern/core/app-config.js +2 -1
  4. package/dist/js/modern/core/compatible.js +66 -48
  5. package/dist/js/modern/core/index.js +3 -2
  6. package/dist/js/modern/core/loader/loaderManager.js +12 -34
  7. package/dist/js/modern/core/loader/useLoader.js +8 -26
  8. package/dist/js/modern/core/plugin.js +6 -28
  9. package/dist/js/modern/document/Body.js +17 -0
  10. package/dist/js/modern/document/DocumentContext.js +6 -0
  11. package/dist/js/modern/document/DocumentStructrueContext.js +7 -0
  12. package/dist/js/modern/document/Head.js +24 -0
  13. package/dist/js/modern/document/Html.js +92 -0
  14. package/dist/js/modern/document/Root.js +31 -0
  15. package/dist/js/modern/document/Scripts.js +10 -0
  16. package/dist/js/modern/document/cli/index.js +132 -0
  17. package/dist/js/modern/document/constants.js +19 -0
  18. package/dist/js/modern/document/index.js +8 -0
  19. package/dist/js/modern/index.js +1 -1
  20. package/dist/js/modern/router/cli/index.js +0 -16
  21. package/dist/js/modern/router/runtime/plugin.js +0 -9
  22. package/dist/js/modern/router/runtime/plugin.node.js +18 -24
  23. package/dist/js/modern/router/runtime/root/index.js +19 -0
  24. package/dist/js/modern/router/runtime/root/load.js +61 -0
  25. package/dist/js/modern/router/runtime/utils.js +16 -35
  26. package/dist/js/modern/router/runtime/withRouter.js +1 -3
  27. package/dist/js/modern/ssr/cli/index.js +2 -23
  28. package/dist/js/modern/ssr/index.js +23 -34
  29. package/dist/js/modern/ssr/index.node.js +0 -13
  30. package/dist/js/modern/ssr/prefetch.js +0 -7
  31. package/dist/js/modern/ssr/react/prerender/index.js +2 -23
  32. package/dist/js/modern/ssr/react/prerender/util.js +2 -17
  33. package/dist/js/modern/ssr/react/withCallback/index.js +0 -1
  34. package/dist/js/modern/ssr/serverRender/helmet.js +12 -20
  35. package/dist/js/modern/ssr/serverRender/index.js +1 -2
  36. package/dist/js/modern/ssr/serverRender/renderToStream/buildTemplate.after.js +5 -5
  37. package/dist/js/modern/ssr/serverRender/renderToStream/bulidTemplate.before.js +45 -11
  38. package/dist/js/modern/ssr/serverRender/renderToStream/index.js +6 -39
  39. package/dist/js/modern/ssr/serverRender/renderToStream/loadable.js +0 -2
  40. package/dist/js/modern/ssr/serverRender/renderToStream/renderToPipe.js +26 -15
  41. package/dist/js/modern/ssr/serverRender/renderToStream/template.js +14 -18
  42. package/dist/js/modern/ssr/serverRender/renderToString/entry.js +2 -34
  43. package/dist/js/modern/ssr/serverRender/renderToString/index.js +0 -2
  44. package/dist/js/modern/ssr/serverRender/renderToString/loadable.js +0 -10
  45. package/dist/js/modern/ssr/serverRender/renderToString/reduce.js +0 -2
  46. package/dist/js/modern/ssr/serverRender/renderToString/template.js +0 -15
  47. package/dist/js/modern/ssr/serverRender/renderToString/type.js +0 -1
  48. package/dist/js/modern/ssr/serverRender/utils.js +2 -6
  49. package/dist/js/modern/ssr/utils.js +0 -11
  50. package/dist/js/modern/state/cli/index.js +0 -11
  51. package/dist/js/modern/state/runtime/plugin.js +1 -14
  52. package/dist/js/node/cli/index.js +6 -14
  53. package/dist/js/node/common.js +0 -2
  54. package/dist/js/node/core/app-config.js +2 -5
  55. package/dist/js/node/core/compatible.js +66 -66
  56. package/dist/js/node/core/index.js +0 -16
  57. package/dist/js/node/core/loader/index.js +0 -2
  58. package/dist/js/node/core/loader/loaderManager.js +12 -37
  59. package/dist/js/node/core/loader/useLoader.js +8 -31
  60. package/dist/js/node/core/plugin.js +5 -34
  61. package/dist/js/node/document/Body.js +26 -0
  62. package/dist/js/node/document/DocumentContext.js +14 -0
  63. package/dist/js/node/document/DocumentStructrueContext.js +15 -0
  64. package/dist/js/node/document/Head.js +33 -0
  65. package/dist/js/node/document/Html.js +98 -0
  66. package/dist/js/node/document/Root.js +41 -0
  67. package/dist/js/node/document/Scripts.js +17 -0
  68. package/dist/js/node/document/cli/index.js +142 -0
  69. package/dist/js/node/document/constants.js +36 -0
  70. package/dist/js/node/document/index.js +93 -0
  71. package/dist/js/node/exports/head.js +0 -5
  72. package/dist/js/node/exports/loadable.js +0 -5
  73. package/dist/js/node/exports/server.js +0 -2
  74. package/dist/js/node/exports/styled.js +0 -5
  75. package/dist/js/node/index.js +0 -8
  76. package/dist/js/node/router/cli/index.js +0 -20
  77. package/dist/js/node/router/index.js +0 -4
  78. package/dist/js/node/router/runtime/DefaultNotFound.js +1 -5
  79. package/dist/js/node/router/runtime/index.js +0 -5
  80. package/dist/js/node/router/runtime/plugin.js +0 -17
  81. package/dist/js/node/router/runtime/plugin.node.js +16 -38
  82. package/dist/js/node/router/runtime/root/index.js +26 -0
  83. package/dist/js/node/router/runtime/root/load.js +69 -0
  84. package/dist/js/node/router/runtime/utils.js +16 -44
  85. package/dist/js/node/router/runtime/withRouter.js +0 -9
  86. package/dist/js/node/runtime-context.js +0 -2
  87. package/dist/js/node/ssr/cli/index.js +2 -26
  88. package/dist/js/node/ssr/index.js +23 -45
  89. package/dist/js/node/ssr/index.node.js +0 -23
  90. package/dist/js/node/ssr/prefetch.js +0 -11
  91. package/dist/js/node/ssr/react/index.js +0 -2
  92. package/dist/js/node/ssr/react/nossr/index.js +0 -6
  93. package/dist/js/node/ssr/react/prerender/index.js +2 -30
  94. package/dist/js/node/ssr/react/prerender/util.js +2 -25
  95. package/dist/js/node/ssr/react/withCallback/index.js +1 -4
  96. package/dist/js/node/ssr/serverRender/helmet.js +13 -20
  97. package/dist/js/node/ssr/serverRender/index.js +1 -4
  98. package/dist/js/node/ssr/serverRender/renderToStream/buildTemplate.after.js +5 -9
  99. package/dist/js/node/ssr/serverRender/renderToStream/buildTemplate.share.js +0 -1
  100. package/dist/js/node/ssr/serverRender/renderToStream/bulidTemplate.before.js +43 -15
  101. package/dist/js/node/ssr/serverRender/renderToStream/index.js +6 -48
  102. package/dist/js/node/ssr/serverRender/renderToStream/loadable.js +0 -4
  103. package/dist/js/node/ssr/serverRender/renderToStream/renderToPipe.js +26 -17
  104. package/dist/js/node/ssr/serverRender/renderToStream/styledComponent.js +0 -2
  105. package/dist/js/node/ssr/serverRender/renderToStream/template.js +16 -23
  106. package/dist/js/node/ssr/serverRender/renderToString/entry.js +2 -51
  107. package/dist/js/node/ssr/serverRender/renderToString/index.js +0 -10
  108. package/dist/js/node/ssr/serverRender/renderToString/loadable.js +0 -14
  109. package/dist/js/node/ssr/serverRender/renderToString/reduce.js +0 -3
  110. package/dist/js/node/ssr/serverRender/renderToString/styledComponent.js +0 -3
  111. package/dist/js/node/ssr/serverRender/renderToString/template.js +0 -18
  112. package/dist/js/node/ssr/serverRender/renderToString/type.js +0 -1
  113. package/dist/js/node/ssr/serverRender/types.js +0 -1
  114. package/dist/js/node/ssr/serverRender/utils.js +2 -8
  115. package/dist/js/node/ssr/utils.js +0 -20
  116. package/dist/js/node/state/cli/index.js +0 -16
  117. package/dist/js/node/state/index.js +0 -4
  118. package/dist/js/node/state/plugins.js +0 -11
  119. package/dist/js/node/state/runtime/index.js +0 -7
  120. package/dist/js/node/state/runtime/plugin.js +1 -25
  121. package/dist/js/treeshaking/cli/index.js +6 -4
  122. package/dist/js/treeshaking/core/app-config.js +2 -1
  123. package/dist/js/treeshaking/core/compatible.js +74 -81
  124. package/dist/js/treeshaking/core/index.js +3 -2
  125. package/dist/js/treeshaking/core/loader/loaderManager.js +19 -51
  126. package/dist/js/treeshaking/core/loader/useLoader.js +11 -28
  127. package/dist/js/treeshaking/core/plugin.js +6 -51
  128. package/dist/js/treeshaking/document/Body.js +14 -0
  129. package/dist/js/treeshaking/document/DocumentContext.js +6 -0
  130. package/dist/js/treeshaking/document/DocumentStructrueContext.js +7 -0
  131. package/dist/js/treeshaking/document/Head.js +21 -0
  132. package/dist/js/treeshaking/document/Html.js +104 -0
  133. package/dist/js/treeshaking/document/Root.js +24 -0
  134. package/dist/js/treeshaking/document/Scripts.js +10 -0
  135. package/dist/js/treeshaking/document/cli/index.js +175 -0
  136. package/dist/js/treeshaking/document/constants.js +16 -0
  137. package/dist/js/treeshaking/document/index.js +8 -0
  138. package/dist/js/treeshaking/index.js +1 -1
  139. package/dist/js/treeshaking/router/cli/index.js +6 -18
  140. package/dist/js/treeshaking/router/runtime/plugin.js +5 -13
  141. package/dist/js/treeshaking/router/runtime/plugin.node.js +23 -36
  142. package/dist/js/treeshaking/router/runtime/root/index.js +17 -0
  143. package/dist/js/treeshaking/router/runtime/root/load.js +102 -0
  144. package/dist/js/treeshaking/router/runtime/utils.js +21 -39
  145. package/dist/js/treeshaking/router/runtime/withRouter.js +1 -0
  146. package/dist/js/treeshaking/ssr/cli/index.js +9 -31
  147. package/dist/js/treeshaking/ssr/index.js +26 -40
  148. package/dist/js/treeshaking/ssr/index.node.js +12 -29
  149. package/dist/js/treeshaking/ssr/prefetch.js +0 -13
  150. package/dist/js/treeshaking/ssr/react/nossr/index.js +3 -4
  151. package/dist/js/treeshaking/ssr/react/prerender/index.js +2 -21
  152. package/dist/js/treeshaking/ssr/react/prerender/util.js +3 -20
  153. package/dist/js/treeshaking/ssr/react/withCallback/index.js +1 -2
  154. package/dist/js/treeshaking/ssr/serverRender/helmet.js +12 -11
  155. package/dist/js/treeshaking/ssr/serverRender/index.js +1 -9
  156. package/dist/js/treeshaking/ssr/serverRender/renderToStream/buildTemplate.after.js +5 -6
  157. package/dist/js/treeshaking/ssr/serverRender/renderToStream/bulidTemplate.before.js +46 -15
  158. package/dist/js/treeshaking/ssr/serverRender/renderToStream/index.js +9 -79
  159. package/dist/js/treeshaking/ssr/serverRender/renderToStream/loadable.js +3 -5
  160. package/dist/js/treeshaking/ssr/serverRender/renderToStream/renderToPipe.js +46 -35
  161. package/dist/js/treeshaking/ssr/serverRender/renderToStream/template.js +17 -24
  162. package/dist/js/treeshaking/ssr/serverRender/renderToString/entry.js +20 -73
  163. package/dist/js/treeshaking/ssr/serverRender/renderToString/index.js +2 -6
  164. package/dist/js/treeshaking/ssr/serverRender/renderToString/loadable.js +5 -16
  165. package/dist/js/treeshaking/ssr/serverRender/renderToString/reduce.js +0 -2
  166. package/dist/js/treeshaking/ssr/serverRender/renderToString/template.js +2 -18
  167. package/dist/js/treeshaking/ssr/serverRender/renderToString/type.js +0 -1
  168. package/dist/js/treeshaking/ssr/serverRender/utils.js +5 -10
  169. package/dist/js/treeshaking/ssr/utils.js +8 -17
  170. package/dist/js/treeshaking/state/cli/index.js +3 -11
  171. package/dist/js/treeshaking/state/runtime/plugin.js +2 -10
  172. package/dist/types/cli/index.d.ts +2 -4
  173. package/dist/types/core/compatible.d.ts +8 -10
  174. package/dist/types/core/index.d.ts +1 -1
  175. package/dist/types/core/loader/loaderManager.d.ts +0 -1
  176. package/dist/types/core/loader/useLoader.d.ts +0 -5
  177. package/dist/types/core/plugin.d.ts +16 -28
  178. package/dist/types/document/Body.d.ts +4 -0
  179. package/dist/types/document/DocumentContext.d.ts +13 -0
  180. package/dist/types/document/DocumentStructrueContext.d.ts +10 -0
  181. package/dist/types/document/Head.d.ts +5 -0
  182. package/dist/types/document/Html.d.ts +4 -0
  183. package/dist/types/document/Root.d.ts +8 -0
  184. package/dist/types/document/Scripts.d.ts +2 -0
  185. package/dist/types/document/cli/index.d.ts +3 -0
  186. package/dist/types/document/constants.d.ts +14 -0
  187. package/dist/types/document/index.d.ts +8 -0
  188. package/dist/types/exports/server.d.ts +3 -3
  189. package/dist/types/index.d.ts +1 -1
  190. package/dist/types/router/cli/index.d.ts +2 -4
  191. package/dist/types/router/runtime/root/index.d.ts +8 -0
  192. package/dist/types/router/runtime/root/load.d.ts +22 -0
  193. package/dist/types/router/runtime/types.d.ts +0 -2
  194. package/dist/types/runtime-context.d.ts +1 -0
  195. package/dist/types/ssr/cli/index.d.ts +2 -4
  196. package/dist/types/ssr/prefetch.d.ts +2 -2
  197. package/dist/types/ssr/serverRender/renderToStream/buildTemplate.after.d.ts +3 -2
  198. package/dist/types/ssr/serverRender/renderToStream/bulidTemplate.before.d.ts +2 -1
  199. package/dist/types/ssr/serverRender/renderToStream/renderToPipe.d.ts +3 -3
  200. package/dist/types/ssr/serverRender/renderToStream/template.d.ts +2 -2
  201. package/dist/types/ssr/serverRender/types.d.ts +3 -6
  202. package/dist/types/state/cli/index.d.ts +2 -4
  203. package/dist/types/state/types.d.ts +0 -1
  204. package/package.json +24 -15
@@ -1,9 +1,6 @@
1
1
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
-
3
2
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
-
5
3
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
-
7
4
  import { loadableReady } from '@loadable/component';
8
5
  import hoistNonReactStatics from 'hoist-non-react-statics';
9
6
  import { RenderLevel } from "./serverRender/types";
@@ -21,29 +18,26 @@ export const ssr = config => ({
21
18
  ModernRender,
22
19
  ModernHydrate
23
20
  }) => {
21
+ var _window, _window$_SSR_DATA;
24
22
  const hydrateContext = _objectSpread(_objectSpread({}, context), {}, {
25
23
  _hydration: true
26
24
  });
27
-
28
25
  const callback = () => {
29
26
  // won't cause component re-render because context's reference identity doesn't change
30
27
  delete hydrateContext._hydration;
31
- }; // react streamSSR hydrate
28
+ };
32
29
 
30
+ // if render level not exist, use client render
31
+ const renderLevel = ((_window = window) === null || _window === void 0 ? void 0 : (_window$_SSR_DATA = _window._SSR_DATA) === null || _window$_SSR_DATA === void 0 ? void 0 : _window$_SSR_DATA.renderLevel) || RenderLevel.CLIENT_RENDER;
33
32
 
33
+ // react streamSSR hydrate
34
34
  if (isReact18() && config.mode === 'stream') {
35
35
  return streamSSRHydrate();
36
- } // react stringSSR hydrate
37
-
38
-
36
+ }
37
+ // react stringSSR hydrate
39
38
  return stringSSRHydrate();
40
-
41
39
  function stringSSRHydrate() {
42
- var _window, _window$_SSR_DATA;
43
-
44
- // if render level not exist, use client render
45
- const renderLevel = ((_window = window) === null || _window === void 0 ? void 0 : (_window$_SSR_DATA = _window._SSR_DATA) === null || _window$_SSR_DATA === void 0 ? void 0 : _window$_SSR_DATA.renderLevel) || RenderLevel.CLIENT_RENDER; // client render and server prefetch use same logic
46
-
40
+ // client render and server prefetch use same logic
47
41
  if (renderLevel === RenderLevel.CLIENT_RENDER || renderLevel === RenderLevel.SERVER_PREFETCH) {
48
42
  ModernRender( /*#__PURE__*/_jsx(App, {
49
43
  context: context
@@ -58,7 +52,6 @@ export const ssr = config => ({
58
52
  context: hydrateContext
59
53
  })
60
54
  });
61
-
62
55
  SSRApp = hoistNonReactStatics(SSRApp, App);
63
56
  ModernHydrate( /*#__PURE__*/_jsx(SSRApp, {}));
64
57
  });
@@ -77,28 +70,29 @@ export const ssr = config => ({
77
70
  }));
78
71
  }
79
72
  }
80
-
81
73
  function streamSSRHydrate() {
82
- // callback: https://github.com/reactwg/react-18/discussions/5
83
- let SSRApp = () => /*#__PURE__*/_jsx(WithCallback, {
84
- callback: callback,
85
- children: /*#__PURE__*/_jsx(App, {
86
- context: hydrateContext
87
- })
88
- });
89
-
90
- SSRApp = hoistNonReactStatics(SSRApp, App);
91
- ModernHydrate( /*#__PURE__*/_jsx(SSRApp, {}));
74
+ if (renderLevel === RenderLevel.SERVER_RENDER) {
75
+ // callback: https://github.com/reactwg/react-18/discussions/5
76
+ let SSRApp = () => /*#__PURE__*/_jsx(WithCallback, {
77
+ callback: callback,
78
+ children: /*#__PURE__*/_jsx(App, {
79
+ context: hydrateContext
80
+ })
81
+ });
82
+ SSRApp = hoistNonReactStatics(SSRApp, App);
83
+ ModernHydrate( /*#__PURE__*/_jsx(SSRApp, {}));
84
+ } else {
85
+ ModernRender( /*#__PURE__*/_jsx(App, {
86
+ context: context
87
+ }));
88
+ }
92
89
  }
93
90
  },
94
-
95
91
  init({
96
92
  context
97
93
  }, next) {
98
94
  var _window2, _window2$_SSR_DATA, _window2$_SSR_DATA$co;
99
-
100
95
  const request = (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$_SSR_DATA = _window2._SSR_DATA) === null || _window2$_SSR_DATA === void 0 ? void 0 : (_window2$_SSR_DATA$co = _window2$_SSR_DATA.context) === null || _window2$_SSR_DATA$co === void 0 ? void 0 : _window2$_SSR_DATA$co.request;
101
-
102
96
  if (!request) {
103
97
  context.ssrContext = _objectSpread(_objectSpread({}, context.ssrContext), {}, {
104
98
  response: mockResp,
@@ -108,25 +102,21 @@ export const ssr = config => ({
108
102
  context
109
103
  });
110
104
  }
111
-
112
105
  context.ssrContext.response = mockResp;
113
106
  context.ssrContext.request = formatClient(request);
114
107
  return next({
115
108
  context
116
109
  });
117
110
  },
118
-
119
111
  pickContext: ({
120
112
  context,
121
113
  pickedContext
122
114
  }, next) => {
123
115
  var _window3, _window3$_SSR_DATA, _window3$_SSR_DATA$co;
124
-
125
116
  const request = (_window3 = window) === null || _window3 === void 0 ? void 0 : (_window3$_SSR_DATA = _window3._SSR_DATA) === null || _window3$_SSR_DATA === void 0 ? void 0 : (_window3$_SSR_DATA$co = _window3$_SSR_DATA.context) === null || _window3$_SSR_DATA$co === void 0 ? void 0 : _window3$_SSR_DATA$co.request;
126
117
  const {
127
118
  initialData
128
119
  } = context;
129
-
130
120
  if (!request) {
131
121
  return next({
132
122
  context,
@@ -135,7 +125,6 @@ export const ssr = config => ({
135
125
  })
136
126
  });
137
127
  }
138
-
139
128
  return next({
140
129
  context,
141
130
  pickedContext: _objectSpread(_objectSpread({}, pickedContext), {}, {
@@ -1,14 +1,8 @@
1
1
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
-
3
2
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
-
5
3
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
-
7
- import { registerPrefetch } from "../core";
8
- import prefetch from "./prefetch";
9
4
  import { formatServer } from "./utils";
10
5
  import render from "./serverRender";
11
- const registeredApps = new WeakSet();
12
6
  export const ssr = (config = {}) => ({
13
7
  name: '@modern-js/plugin-ssr',
14
8
  setup: () => {
@@ -17,11 +11,6 @@ export const ssr = (config = {}) => ({
17
11
  App,
18
12
  context
19
13
  }) => {
20
- if (!registeredApps.has(App)) {
21
- registerPrefetch(App, _context => prefetch(App, _context));
22
- registeredApps.add(App);
23
- }
24
-
25
14
  const html = await render({
26
15
  context: context,
27
16
  App: App,
@@ -29,7 +18,6 @@ export const ssr = (config = {}) => ({
29
18
  });
30
19
  return html;
31
20
  },
32
-
33
21
  init({
34
22
  context
35
23
  }, next) {
@@ -41,7 +29,6 @@ export const ssr = (config = {}) => ({
41
29
  context
42
30
  });
43
31
  },
44
-
45
32
  pickContext: ({
46
33
  context,
47
34
  pickedContext
@@ -2,18 +2,15 @@ import { renderToStaticMarkup } from 'react-dom/server';
2
2
  import { run } from '@modern-js/utils/ssr';
3
3
  import { ChunkExtractor } from '@loadable/server';
4
4
  import { jsx as _jsx } from "react/jsx-runtime";
5
-
6
5
  // todo: SSRContext
7
6
  const prefetch = async (App, context) => run(context.ssrContext.request.headers, async () => {
8
7
  var _context$store;
9
-
10
8
  const {
11
9
  ssrContext
12
10
  } = context;
13
11
  const {
14
12
  loadableStats
15
13
  } = ssrContext;
16
-
17
14
  if (loadableStats) {
18
15
  const extractor = new ChunkExtractor({
19
16
  stats: loadableStats,
@@ -27,18 +24,15 @@ const prefetch = async (App, context) => run(context.ssrContext.request.headers,
27
24
  context: context
28
25
  }));
29
26
  }
30
-
31
27
  if (!context.loaderManager.hasPendingLoaders()) {
32
28
  return {
33
29
  initialData: context.initialData,
34
30
  i18nData: context.__i18nData__
35
31
  };
36
32
  }
37
-
38
33
  const loadersData = await context.loaderManager.awaitPendingLoaders();
39
34
  Object.keys(loadersData).forEach(id => {
40
35
  const data = loadersData[id];
41
-
42
36
  if (data._error) {
43
37
  ssrContext.logger.error('App Prefetch Loader', data._error);
44
38
  ssrContext.metrics.emitCounter('app.prefetch.loader.error', 1);
@@ -53,5 +47,4 @@ const prefetch = async (App, context) => run(context.ssrContext.request.headers,
53
47
  storeState: context === null || context === void 0 ? void 0 : (_context$store = context.store) === null || _context$store === void 0 ? void 0 : _context$store.getState()
54
48
  };
55
49
  });
56
-
57
50
  export default prefetch;
@@ -1,9 +1,6 @@
1
1
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
-
3
2
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
-
5
3
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
-
7
4
  import withSideEffect from 'react-side-effect';
8
5
  import React, { createElement } from 'react';
9
6
  import { getOutermostProperty, aggKeysFromPropsList, exist, aggMatchesFromPropsList } from "./util";
@@ -16,10 +13,9 @@ const PROP_NAMES = {
16
13
  FALLBACK: 'fallback',
17
14
  MATCHES: 'matches'
18
15
  };
19
-
20
- const handleClientStateChange = () => {// not used
16
+ const handleClientStateChange = () => {
17
+ // not used
21
18
  };
22
-
23
19
  const mapStateOnServer = reduceProps => {
24
20
  const defaultProps = {
25
21
  interval: 10,
@@ -34,17 +30,14 @@ const mapStateOnServer = reduceProps => {
34
30
  const propKey = key;
35
31
  const reduceProp = reduceProps[propKey];
36
32
  let nextProps = props;
37
-
38
33
  if (exist(reduceProp)) {
39
34
  nextProps = _objectSpread(_objectSpread({}, props), {}, {
40
35
  [propKey]: reduceProp
41
36
  });
42
37
  }
43
-
44
38
  return nextProps;
45
39
  }, defaultProps);
46
40
  };
47
-
48
41
  const reducePropsToState = propsList => {
49
42
  const reduceProps = {
50
43
  interval: getOutermostProperty(propsList, PROP_NAMES.INTERVAL),
@@ -57,48 +50,34 @@ const reducePropsToState = propsList => {
57
50
  };
58
51
  return reduceProps;
59
52
  };
60
-
61
53
  function factory(Component) {
62
54
  class Spr extends React.Component {
63
55
  static set canUseDOM(canUseDOM) {
64
56
  Component.canUseDOM = canUseDOM;
65
57
  }
66
-
67
58
  static get canUseDOM() {
68
59
  return Component.canUseDOM;
69
60
  }
70
-
71
61
  verify() {
72
62
  return true;
73
63
  }
74
-
75
64
  render() {
76
65
  const newProps = _objectSpread({}, this.props);
77
-
78
66
  const validate = this.verify();
79
-
80
67
  if (!validate) {
81
68
  throw new Error('invalid props, check usage');
82
69
  }
83
-
84
70
  return /*#__PURE__*/createElement(Component, _objectSpread({}, newProps));
85
71
  }
86
-
87
72
  }
88
-
89
73
  _defineProperty(Spr, "peek", Component.peek);
90
-
91
74
  _defineProperty(Spr, "rewind", Component.rewind);
92
-
93
75
  _defineProperty(Spr, "config", () => {
94
76
  const mappedState = Component.rewind();
95
77
  return mappedState;
96
78
  });
97
-
98
79
  return Spr;
99
80
  }
100
-
101
81
  const NullComponent = () => null;
102
-
103
82
  const SprSideEffects = withSideEffect(reducePropsToState, handleClientStateChange, mapStateOnServer)(NullComponent);
104
83
  export const PreRender = factory(SprSideEffects);
@@ -2,12 +2,10 @@ const REQUEST_META = ['header', 'query'];
2
2
  export const getInnermostProperty = function getInnermostProperty(propsList, propName) {
3
3
  for (let i = propsList.length - 1; i >= 0; i--) {
4
4
  const props = propsList[i];
5
-
6
5
  if (props.hasOwnProperty(propName)) {
7
6
  return props[propName];
8
7
  }
9
8
  }
10
-
11
9
  return null;
12
10
  };
13
11
  export const getOutermostProperty = function getOutermostProperty(propsList, propName) {
@@ -16,7 +14,6 @@ export const getOutermostProperty = function getOutermostProperty(propsList, pro
16
14
  return props[propName];
17
15
  }
18
16
  }
19
-
20
17
  return null;
21
18
  };
22
19
  export const aggKeysFromPropsList = function aggKeysFromPropsList(propsList, propName) {
@@ -28,7 +25,6 @@ export const aggKeysFromPropsList = function aggKeysFromPropsList(propsList, pro
28
25
  const res = propsList.filter(props => usefulObject(props[propName])).reduce((result, next) => {
29
26
  REQUEST_META.forEach(key => {
30
27
  const prop = next[propName];
31
-
32
28
  if (prop !== null && prop !== void 0 && prop.hasOwnProperty(key) && usefulArray(prop[key])) {
33
29
  result[key] = unique(result[key].concat(prop[key]));
34
30
  }
@@ -37,13 +33,10 @@ export const aggKeysFromPropsList = function aggKeysFromPropsList(propsList, pro
37
33
  }, initResult);
38
34
  return REQUEST_META.reduce((result, next) => {
39
35
  var _result$key;
40
-
41
36
  const key = next;
42
-
43
37
  if (result[key] && ((_result$key = result[key]) === null || _result$key === void 0 ? void 0 : _result$key.length) === 0) {
44
38
  delete result[key];
45
39
  }
46
-
47
40
  return result;
48
41
  }, res);
49
42
  };
@@ -55,8 +48,8 @@ export const aggMatchesFromPropsList = function aggMatchesFromPropsList(propsLis
55
48
  }, {});
56
49
  const res = propsList.filter(props => usefulObject(props[propName])).reduce((result, next) => {
57
50
  REQUEST_META.forEach(key => {
58
- const prop = next[propName]; // 这边目前是浅拷贝,越后渲染优先级越高
59
-
51
+ const prop = next[propName];
52
+ // 这边目前是浅拷贝,越后渲染优先级越高
60
53
  if (prop !== null && prop !== void 0 && prop.hasOwnProperty(key) && usefulObject(prop[key])) {
61
54
  result[key] = Object.assign(result[key], prop[key]);
62
55
  }
@@ -65,35 +58,27 @@ export const aggMatchesFromPropsList = function aggMatchesFromPropsList(propsLis
65
58
  }, initResult);
66
59
  return REQUEST_META.reduce((result, next) => {
67
60
  const key = next;
68
-
69
61
  if (result[key] && Object.keys(result[key]).length === 0) {
70
62
  delete result[key];
71
63
  }
72
-
73
64
  return result;
74
65
  }, res);
75
66
  };
76
-
77
67
  function unique(arr) {
78
68
  return Array.from(new Set(arr));
79
69
  }
80
-
81
70
  function usefulObject(target) {
82
71
  if (!exist(target)) {
83
72
  return false;
84
73
  }
85
-
86
74
  return target.constructor === Object && Object.keys(target).length > 0;
87
75
  }
88
-
89
76
  function usefulArray(target) {
90
77
  if (!exist(target)) {
91
78
  return false;
92
79
  }
93
-
94
80
  return Array.isArray(target) && target.length > 0;
95
81
  }
96
-
97
82
  export function exist(target) {
98
83
  return target != null;
99
84
  }
@@ -9,7 +9,6 @@ export const WithCallback = ({
9
9
  if (once.current) {
10
10
  return;
11
11
  }
12
-
13
12
  once.current = true;
14
13
  callback();
15
14
  }, [callback]);
@@ -1,46 +1,38 @@
1
1
  // 用于 react-helmet 正则替换
2
+ import { EOL } from 'os';
2
3
  const RE_HTML_ATTR = /<html[^>]*>/;
3
4
  const RE_BODY_ATTR = /<body[^>]*>/;
4
5
  const RE_LAST_IN_HEAD = /<\/head>/;
5
6
  const RE_TITLE = /<title[^>]*>([\s\S\n\r]*?)<\/title>/;
6
- const TEST_TITLE_CONTENT = /(?<=<title[^>]*>)([\s\S\n\r]*?)([.|\S])([\s\S\n\r]*?)(?=<\/title>)/; // 通过 react-helmet 修改模板
7
+ const TEST_TITLE_CONTENT = /(?<=<title[^>]*>)([\s\S\n\r]*?)([.|\S])([\s\S\n\r]*?)(?=<\/title>)/;
7
8
 
9
+ // 通过 react-helmet 修改模板
8
10
  export default function helmet(content, helmetData) {
9
11
  let result = content;
10
12
  const bodyAttributes = helmetData.bodyAttributes.toString();
11
-
12
13
  if (bodyAttributes) {
13
14
  result = result.replace(RE_BODY_ATTR, `<body ${bodyAttributes}>`);
14
15
  }
15
-
16
16
  const htmlAttributes = helmetData.htmlAttributes.toString();
17
-
18
17
  if (htmlAttributes) {
19
18
  result = result.replace(RE_HTML_ATTR, `<html ${htmlAttributes}>`);
20
19
  }
21
-
22
20
  const base = helmetData.base.toString();
23
21
  const link = helmetData.link.toString();
24
22
  const meta = helmetData.meta.toString();
25
23
  const noscript = helmetData.noscript.toString();
26
24
  const script = helmetData.script.toString();
27
25
  const style = helmetData.style.toString();
28
- const title = helmetData.title.toString(); // 如果模板中存在 title,且 helmetData title 有内容则做替换
29
-
30
- const existTitle = RE_TITLE.test(content);
26
+ const title = helmetData.title.toString();
31
27
 
32
- if (TEST_TITLE_CONTENT.test(title.trim()) && existTitle) {
28
+ // 如果模板中存在 title,且 helmetData title 有内容则做替换
29
+ const existTitleTag = RE_TITLE.test(content);
30
+ const shouldReplaceTitle = existTitleTag && TEST_TITLE_CONTENT.test(title.trim());
31
+ if (shouldReplaceTitle) {
33
32
  result = result.replace(RE_TITLE, title);
34
33
  }
35
-
36
- return result.replace(RE_LAST_IN_HEAD, `
37
- ${base}
38
- ${link}
39
- ${meta}
40
- ${noscript}
41
- ${script}
42
- ${style}
43
- ${existTitle ? '' : title}
44
- </head>
45
- `);
34
+ const helmetStr = [base, link, meta, noscript, script, style, !existTitleTag ? title : ''].reduce((pre, cur) => {
35
+ return pre + (cur.length > 0 ? ` ${cur}${EOL}` : '');
36
+ }, '');
37
+ return result.replace(RE_LAST_IN_HEAD, `${helmetStr}</head>`);
46
38
  }
@@ -1,8 +1,7 @@
1
1
  /* eslint-disable eslint-comments/disable-enable-pair */
2
-
3
2
  /* eslint-disable @typescript-eslint/no-var-requires */
4
-
5
3
  /* eslint-disable @typescript-eslint/no-require-imports */
4
+
6
5
  import { isReact18 } from "../utils";
7
6
  export default async function serverRender(options) {
8
7
  if (isReact18() && options.config.mode === 'stream') {
@@ -3,15 +3,14 @@ import { buildTemplate } from "./buildTemplate.share";
3
3
  export function buildShellAfterTemplate(afterAppTemplate, options) {
4
4
  const callbacks = [injectSSRDataScript];
5
5
  return buildTemplate(afterAppTemplate, callbacks);
6
-
7
6
  function injectSSRDataScript(template) {
8
7
  const ssrDataScript = buildSSRDataScript();
9
8
  return template.replace('<!--<?- SSRDataScript ?>-->', ssrDataScript);
10
-
11
9
  function buildSSRDataScript() {
12
10
  const {
13
- ssrContext
14
- } = options.context;
11
+ ssrContext,
12
+ renderLevel
13
+ } = options;
15
14
  const {
16
15
  request
17
16
  } = ssrContext;
@@ -26,7 +25,8 @@ export function buildShellAfterTemplate(afterAppTemplate, options) {
26
25
  headers: request.headers,
27
26
  cookieMap: request.cookieMap
28
27
  }
29
- }
28
+ },
29
+ renderLevel
30
30
  };
31
31
  return `
32
32
  <script>window._SSR_DATA = ${serialize(SSRData, {
@@ -1,24 +1,58 @@
1
1
  import ReactHelmet from 'react-helmet';
2
+ import { matchRoutes } from 'react-router-dom';
2
3
  import helmetReplace from "../helmet";
3
- import { HEAD_REG_EXP, buildTemplate } from "./buildTemplate.share"; // build head template
4
+ import { HEAD_REG_EXP, buildTemplate } from "./buildTemplate.share";
5
+ const CSS_CHUNKS_PLACEHOLDER = '<!--<?- chunksMap.css ?>-->';
4
6
 
5
- function getHeadTemplate(beforeEntryTemplate) {
7
+ // build head template
8
+ function getHeadTemplate(beforeEntryTemplate, context) {
6
9
  const callbacks = [headTemplate => {
7
10
  const helmetData = ReactHelmet.renderStatic();
8
11
  return helmetData ? helmetReplace(headTemplate, helmetData) : headTemplate;
9
- }];
12
+ },
13
+ // @TODO: prefetch scripts of lazy component
14
+ injectCss];
10
15
  const [headTemplate = ''] = beforeEntryTemplate.match(HEAD_REG_EXP) || [];
11
-
12
16
  if (!headTemplate.length) {
13
17
  return '';
14
18
  }
19
+ return buildTemplate(headTemplate, callbacks);
20
+ function injectCss(headTemplate) {
21
+ return headTemplate.replace(CSS_CHUNKS_PLACEHOLDER, getCssChunks());
22
+ function getCssChunks() {
23
+ const {
24
+ routeManifest,
25
+ routerContext,
26
+ routes
27
+ } = context;
28
+ if (!routeManifest || !routerContext || !routes) {
29
+ return '';
30
+ }
31
+ const {
32
+ routeAssets
33
+ } = routeManifest;
34
+ const cssChunks = [];
35
+ const matches = matchRoutes(routes, routerContext.location);
36
+ matches === null || matches === void 0 ? void 0 : matches.forEach(match => {
37
+ const routeId = match.route.id;
38
+ if (routeId) {
39
+ const {
40
+ assets = []
41
+ } = routeAssets[routeId];
42
+ const _cssChunks = assets.filter(asset => asset === null || asset === void 0 ? void 0 : asset.endsWith('.css'));
43
+ cssChunks.push(..._cssChunks);
44
+ }
45
+ });
46
+ const styleLinks = cssChunks.map(chunk => {
47
+ return `<link href="${chunk}" rel="stylesheet" />`;
48
+ });
49
+ return `${styleLinks.join('')}`;
50
+ }
51
+ }
52
+ }
15
53
 
16
- return buildTemplate(headTemplate, callbacks); // @TODO: inject css chunks of lazy components
17
- // @TODO: prefetch scripts of lazy component
18
- } // build script
19
-
20
-
21
- export function buildShellBeforeTemplate(beforeAppTemplate) {
22
- const headTemplate = getHeadTemplate(beforeAppTemplate);
54
+ // build script
55
+ export function buildShellBeforeTemplate(beforeAppTemplate, context) {
56
+ const headTemplate = getHeadTemplate(beforeAppTemplate, context);
23
57
  return beforeAppTemplate.replace(HEAD_REG_EXP, headTemplate);
24
58
  }
@@ -2,7 +2,6 @@ import { createElement } from 'react';
2
2
  import { run } from '@modern-js/utils/ssr';
3
3
  import { PreRender } from "../../react/prerender";
4
4
  import { time } from "../utils";
5
- import { createTemplates } from "./template";
6
5
  import renderToPipe from "./renderToPipe";
7
6
  export const render = ({
8
7
  App,
@@ -11,63 +10,31 @@ export const render = ({
11
10
  const {
12
11
  ssrContext
13
12
  } = context;
14
-
15
13
  if (!ssrContext) {
16
14
  throw new Error('The "ssrContext" must not be undefined, but received undefined');
17
15
  }
18
-
19
16
  return run(ssrContext.request.headers, async () => {
20
- const end_all = time();
17
+ const end = time();
21
18
  const rootElement = /*#__PURE__*/createElement(App, {
22
19
  context: Object.assign(context || {}, {
23
20
  ssr: true
24
21
  })
25
22
  });
26
- const getTemplates = createTemplates(context);
27
- const end = time();
28
- const pipe = renderToPipe(rootElement, getTemplates, {
23
+ const pipe = renderToPipe(rootElement, context, {
29
24
  onShellReady() {
30
25
  // set cacheConfig
31
26
  const cacheConfig = PreRender.config();
32
-
33
27
  if (cacheConfig) {
34
- context.ssrContext.cacheConfig = cacheConfig;
28
+ ssrContext.cacheConfig = cacheConfig;
35
29
  }
36
30
  },
37
-
38
31
  onAllReady() {
39
- // computed render html cost
32
+ // calculate streaming ssr cost
40
33
  const cost = end();
41
34
  ssrContext.logger.debug('App Render To HTML cost = %d ms', cost);
42
- ssrContext.metrics.emitTimer('app.render.html.cost', cost); // computed all ssr const
43
-
44
- const cost_all = end_all();
45
- ssrContext.logger.info('App Render Total cost = %d ms', cost_all);
46
- ssrContext.metrics.emitTimer('app.render.cost', cost_all);
35
+ ssrContext.metrics.emitTimer('app.render.html.cost', cost);
47
36
  }
48
-
49
37
  });
50
38
  return pipe;
51
- }); // eslint-disable-next-line @typescript-eslint/no-unused-vars
52
-
53
- async function prefetch(App, context) {
54
- const {
55
- prefetch
56
- } = App;
57
- const ssrContext = context.ssrContext;
58
- let prefetchData;
59
- const end = time();
60
-
61
- try {
62
- prefetchData = prefetch ? await prefetch(context) : null;
63
- const prefetchCost = end();
64
- ssrContext.logger.debug(`App Prefetch cost = %d ms`, prefetchCost);
65
- ssrContext.metrics.emitTimer('app.prefetch.cost', prefetchCost);
66
- } catch (e) {
67
- ssrContext.logger.error('App Prefetch Render', e);
68
- ssrContext.metrics.emitCounter('app.prefetch.render.error', 1);
69
- }
70
-
71
- return prefetchData || {};
72
- }
39
+ });
73
40
  };
@@ -7,13 +7,11 @@ export function getLoadableChunks({
7
7
  loadableStats,
8
8
  entryName
9
9
  } = context.ssrContext;
10
-
11
10
  if (!loadableStats) {
12
11
  return {
13
12
  jsx
14
13
  };
15
14
  }
16
-
17
15
  const extractor = new ChunkExtractor({
18
16
  stats: loadableStats,
19
17
  entrypoints: [entryName]