Grid view slow

[hterik]

Under which category would you file this issue?

Airflow Core

Apache Airflow version

3.2.2

What happened and how to reproduce it?

For a moderately sized dag with approx 30 tasks and history of 25 dag runs shown, the grid view is extremely slow. Clicking on items in the grid has signifiant yank and delay. This was not an issue in Airflow 2.

• Just hovering over an item has noticeable lag before the row is highlighted
• Clicking on an item in the grid causes the grid to flicker into white, before showing the same content again. Then it takes 3-4 seconds for the content in the details tab to load.
• It is likely not an API issue, looking in the network tab of the browser shows this after clicking on an item in the grid:
  
  • The requests are served pretty fast: ~50ms each
  • There's not excessive amounts of requests: 6 per click, which is not great, but not terrible either. Two minor things standing out:
    • hitlDetails and externalLogUrl are seperate endpoints. Better to merge them into the tasks or taskInstances endpoint?
    • /ui/grid/ti_summaries appears to reload on every click, even if clicking a task doesn't change the range of displayed dagruns
  • It some times takes a second after clicking even for the first request to be sent (not seen in the graph)
  • After the last response has been received, it takes nearly a second for the UI to be updated (not seen in the graph)

What you think should happen instead?

No response

Operating System

Ubuntu

Deployment

Other

Apache Airflow Provider(s)

No response

Versions of Apache Airflow Providers

apache-airflow==3.2.2
apache-airflow-client==3.2.2
apache-airflow-core==3.2.2
apache-airflow-mypy==0.1.0
apache-airflow-providers-celery==3.20.0
apache-airflow-providers-cncf-kubernetes==10.17.1
apache-airflow-providers-common-compat==1.15.0
apache-airflow-providers-common-io==1.7.2
apache-airflow-providers-common-sql==2.0.0
apache-airflow-providers-docker==4.5.6
apache-airflow-providers-fab==3.6.4
apache-airflow-providers-postgres==6.7.0
apache-airflow-providers-smtp==3.0.1
apache-airflow-providers-standard==1.13.1
apache-airflow-task-sdk==1.2.2

Official Helm Chart version

Not Applicable

Kubernetes Version

No response

Helm Chart configuration

No response

Docker Image customizations

No response

Anything else?

No response

Are you willing to submit PR?

• Yes I am willing to submit a PR!

Code of Conduct

• I agree to follow this project's Code of Conduct

[pierrejeambrun]

Thanks for opening the issue. Would you mind sharing a dummy / reproducing sample dag that we can use to trigger the bug.

Also can you provide a screen recording of the scenario you are mentioning?

Something must be off. I just tested on main on a dags with 1000 tasks, and more than a 1000 runs. It's usable and there is no significant delay, on a small dag like you are mentioning it should be smooth.

[hterik]

See attached video.
It's hard to capture the actual clicks in the video, i tried to capture it by moving the cursor away as fast as possible after clicking, you can see that there is a lot of time to do so before the task is loaded. On the second click you can also see the white flash, it doesn't always happen.

airflow.grid.slow.mp4

Here is also a capture from the Firefox profiler. You can see paint there taking 1+ second. Many other heavy javascript frames are seen, they are obfuscated though so i didn't dig much deeper there.

[pierrejeambrun]

Thanks for the details