Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: SSR support useServerInsertedHTML #12247

Merged

Conversation

MadCcc
Copy link
Contributor

@MadCcc MadCcc commented Mar 28, 2024

概述

  1. 在 SSR 渲染时加入 ServerInsertedHTML 上下文,并在流式输出的最后一并拼在末尾
  2. 与 React 分段 SSR 处理一样,添加一段 script 把所有 serverInsertedHTML 移动到 head 末尾

测试了 antd 和多个 serverInsertedHTML,SSR 渲染未出现闪烁,可能需要更极端的情况测试。

为什么不在流中处理

由于需要将上下文里的内容放置在 head 标签中,当前 chunk 不包含 </head> 时就已经无法插入了,因此 Suspense 下的 useServerHTML 会失效,如果等流结束统一处理又会失去流的效果。

Copy link

vercel bot commented Mar 28, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment
Name Status Preview Comments Updated (UTC)
umi ⬜️ Ignored (Inspect) Visit Preview Apr 1, 2024 6:19am

Copy link

coderabbitai bot commented Mar 28, 2024

Important

Auto Review Skipped

Auto reviews are disabled on base/target branches other than the default branch. Please add the base/target branch pattern to the list of additional branches to be reviewed in the settings.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository.

To trigger a single review, invoke the @coderabbitai review command.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai generate interesting stats about this repository and render them as a table.
    • @coderabbitai show all the console.log statements in this repository.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • The JSON schema for the configuration file is available here.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

CodeRabbit Discord Community

Join our Discord Community to get help, request features, and share feedback.

Copy link

codecov bot commented Mar 28, 2024

Codecov Report

Attention: Patch coverage is 0% with 38 lines in your changes are missing coverage. Please review.

Project coverage is 28.30%. Comparing base (3de4a38) to head (a295fdd).
Report is 5 commits behind head on feature/new-unio-ssr.

❗ Current head a295fdd differs from pull request most recent head 8204eff. Consider uploading reports for the commit 8204eff to get more accurate results

Files Patch % Lines
packages/server/src/ssr.ts 0.00% 33 Missing and 5 partials ⚠️
Additional details and impacted files
@@                   Coverage Diff                    @@
##           feature/new-unio-ssr   #12247      +/-   ##
========================================================
- Coverage                 28.41%   28.30%   -0.12%     
========================================================
  Files                       492      492              
  Lines                     15168    15227      +59     
  Branches                   3627     3643      +16     
========================================================
  Hits                       4310     4310              
- Misses                    10086    10139      +53     
- Partials                    772      778       +6     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

packages/server/src/ssr.ts Outdated Show resolved Hide resolved
packages/server/src/ssr.ts Outdated Show resolved Hide resolved
packages/server/src/ssr.ts Outdated Show resolved Hide resolved
@MadCcc MadCcc changed the base branch from feature/new-unio-ssr to master April 1, 2024 06:15
@MadCcc MadCcc changed the base branch from master to feature/new-unio-ssr April 1, 2024 06:16
Copy link
Member

@PeachScript PeachScript left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1

@PeachScript PeachScript merged commit ae9dc25 into umijs:feature/new-unio-ssr Apr 1, 2024
23 checks passed
Jinbao1001 added a commit that referenced this pull request Jun 27, 2024
* feat(preset-umi): unify request handler for ssr and always use stream (#12229)

* refactor(preset): improve types for ssr request handler

* refactor(preset-umi): provide unified request handler for ssr

* refactor: add stream response header

* refactor: correct ts lib usage

* chore: update comment

* refactor: warn for deprecated ssr exports

* refactor: async-able for worker ssr request handler

* refactor: update worker mode condition

* refactor: type correct

* feat: SSR support useServerInsertedHTML (#12247)

* feat: SSR support useServerInsertedHTML

* feat: ssr insert html

* fix: string template

* chore: update lock

* fix: metadata and hydrate root mismatched between csr and ssr (#12220)

* feat: ssr支持head body 配置

* feat: support ssr

* fix: 回退metaloader执行逻辑判断

* fix: ts lint

* feat: 优化部分ssr代码

* feat: add client metadata hydrate data

* docs: hydtateFromRoot doc 修正

* fix: delete merge.with deps

* fix: delete merge.with deps

* fix: change hydrateFromRoot root to renderFromRoot

* fix: NormalizeMeta component for render root

* fix: NormalizeMeta component for render root

---------

Co-authored-by: xiaoxiao <[email protected]>
Co-authored-by: Jinbao1001 <[email protected]>

* fix: hydrate logic for ssr (#12255)

* feat: ssr支持head body 配置

* feat: support ssr

* fix: 回退metaloader执行逻辑判断

* fix: ts lint

* feat: 优化部分ssr代码

* feat: add client metadata hydrate data

* docs: hydtateFromRoot doc 修正

* fix: delete merge.with deps

* fix: delete merge.with deps

* fix: change hydrateFromRoot root to renderFromRoot

* fix: NormalizeMeta component for render root

* fix: NormalizeMeta component for render root

* fix: hydrate 遗留问题处理

* fix: ts-ignore window.__

* fix: 空格

* fix: lint

---------

Co-authored-by: xiaoxiao <[email protected]>
Co-authored-by: Jinbao1001 <[email protected]>

* release: 4.0.0-canary.20240402.1

* fix: wrong react-dom server api for worker ssr mode (#12263)

* fix: wrong react-dom server api for worker ssr mode

* refactor: rename config

* refactor: correct logic

* fix: locked stream in ssr

* feat: align compile time and runtime plugin api between csr and ssr (#12279)

* feat: ssr支持head body 配置

* feat: support ssr

* fix: 回退metaloader执行逻辑判断

* fix: ts lint

* feat: 优化部分ssr代码

* feat: add client metadata hydrate data

* docs: hydtateFromRoot doc 修正

* fix: delete merge.with deps

* fix: delete merge.with deps

* fix: change hydrateFromRoot root to renderFromRoot

* fix: NormalizeMeta component for render root

* fix: NormalizeMeta component for render root

* fix: hydrate 遗留问题处理

* fix: ts-ignore window.__

* fix: 空格

* fix: lint

* feat: addEntryCode to ssr and share the pluginManager

* fix: curry and createPluginManager

* feat: 提取公共 request 方法

* fix: serverloaderRequest

* fix: serverloaderRequest

* fix: serverloaderRequest

* fix: serverloaderRequest

* fix: curry

* fix: curry

* fix: 补充importsAhead and imports

* fix: 条件判断更换

* fix: 代码优化

* fix: tslint

* fix: tslint

* fix: async function export

* fix: add g_umi export and some fixded

* fix: string export

* fix: await clientroutePatch

* feat: patchClientRoutes to async

* fix: ssr禁用 inintial state loading

* feat: 提供render钩子给主应用执行

* feat: 提供render钩子给主应用执行

* feat: 提供render钩子给主应用执行

* feat: to async

* feat: stream render 钩子

* fix: 修改render执行时机

* fix: 移出otherwise逻辑

---------

Co-authored-by: xiaoxiao <[email protected]>
Co-authored-by: Jinbao1001 <[email protected]>

* feat: qiankun plugin compatible with ssr runtime (#12295)

* feat: qiankun 插件支持 ssr

* fix: cr

* fix: 修改 external 的机制

* fix: 增加 ssr render 后,处理 qiankun 的生命周期

* feat: use prerender html directly in ssg (#12317)

* feat: use prerender html directly in ssg

* fix: ssg

* fix: add bootstrap script

* chore: 优先从环境变量读取 manifest 路径 (#12354)

* fix: ssr manifest 正确读取环境变量 (#12357)

* fix: ssr manifest 正确读取环境变量

* chore: 新增 ssr 黑盒变量 SSR_RESOURCE_DIR

* refactor: improve platform checking logic for qiankun slave (#12331)

* feat: qiankun 插件支持 ssr

* fix: cr

* fix: 修改 external 的机制

* fix: 增加 ssr render 后,处理 qiankun 的生命周期

* fix: qiankun slave ssr

* fix: change ssr to isServer

* chore: use process.env.SSR_RESOURCE_DIR replace SSR_RESOURCE_DIR (#12370)

* chore: use process.env.ssr_manifest

* chore: fomatcode

* feat: provide useLoaderData for fallback serverLoader (#12339)

* fix: ssr downgrade init

* feat: add deprecated

* chore: 代码优化

* fix: woker don't need to inject umi.js

* chore: renderFromRoot to __SPECIAL_HTML_DO_NOT_USE_OR_YOU_WILL_BE_FIRED (#12384)

* refactor: add renderFromRoot for tern theme (#12385)

* feat: mako for ssr (#12409)

* fix: ssr mako init

* chore: 删除冗余webpack配置代码

* feat: finish mako bundler for ssr

* feat: generator manifest

* refactor: mako outputpath use bundler-webpack default value

* feat: add mako hooks (#12412)

* refactor(preset-umi): handle illegal route absPath in route preload (#12363)

* refactor(preset-umi): handle unexpected route absPath in route preload

* chore: correct logic

* fix: renderClient opts miss internal vars (#12419)

* release: 4.2.6-alpha.1

* release: 4.2.6-alpha.2

* release: 4.2.6-alpha.3

* release: 4.2.6-alpha.4

* feat: mako build and ssr finished

* chore: delete code

* chore: update lock

* chore: update lock

* chore: update lock

* chore: update lock

* chore: change plugins to makoPlugins

* chore(deps): update mako version

---------

Co-authored-by: Peach <[email protected]>
Co-authored-by: MadCcc <[email protected]>
Co-authored-by: xiaoxiao <[email protected]>
Co-authored-by: Jinbao1001 <[email protected]>
Co-authored-by: Bravepg <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants