shivaam opened a new pull request, #69806:
URL: https://github.com/apache/airflow/pull/69806

   The DAG Card view currently mounts all cards and their interactive controls 
in one synchronous render, even when most cards are below the viewport. On a 
cached 50-DAG page this can keep the UI unavailable for about a second.
   
   This change adds an opt-in progressive mode to `CardList` and enables it for 
DAG cards. It mounts the first five cards immediately, reserves stable space 
for the remaining rows, and completes them in small React transitions. Existing 
card-list consumers remain synchronous.
   
   Each slot is memoized so a completed card is constructed once rather than on 
every batch. Filtering, sorting, pagination, or another row-set change restarts 
mounting with stable DAG keys.
   
   On a controlled 50-card/14-run fixture, first usable Card view improved from 
a 1111 ms median to 743 ms (368 ms / 33%) with zero placeholder-fill layout 
shift. Chromium, Firefox, and WebKit all completed all 50 cards. Background 
batches still perform real work and full completion takes longer, but their 
142-158 ms tasks are materially shorter than the current synchronous baseline's 
roughly 997 ms task median.
   
   closes: #69609
   
   ### Testing
   
   - `pnpm exec vitest run src/components/DataTable/DataTable.test.tsx 
src/pages/DagsList/DagCard.test.tsx --reporter=dot` (27 passed)
   - `pnpm exec tsc --p tsconfig.app.json --noEmit`
   - targeted ESLint and Prettier
   - `pnpm build`
   - Airflow `prek` hooks on changed files
   - live UI lifecycle, filtering, and scrolling checks
   - Playwright behavior checks in Chromium, Firefox, and WebKit
   
   Before/after recording will be attached while this PR is in Draft.
   
   ---
   
   ##### Was generative AI tooling used to co-author this PR?
   
   - [X] Yes (OpenAI Codex)
   
   Generated-by: OpenAI Codex following [the 
guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#gen-ai-assisted-contributions)
   
   ---
   
   * Read the **[Pull Request 
Guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#pull-request-guidelines)**
 for more information. Note: commit author/co-author name and email in commits 
become permanently public when merged.
   * For significant user-facing changes create newsfragment: 
`{pr_number}.significant.rst`, in 
[airflow-core/newsfragments](https://github.com/apache/airflow/tree/main/airflow-core/newsfragments).
 You can add this file in a follow-up commit after the PR is created so you 
know the PR number.
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to