Skip to content

🐛 data-turbo-track: "reload" causes persistent performance degradation in Rails 8.0.2 #749

@tomasbecklin

Description

@tomasbecklin

🐛 data-turbo-track: "reload" causes persistent performance degradation in Rails 8.0.2

Environment

  • Rails: 8.0.2
  • turbo-rails: 2.0.x
  • Ruby: 3.4.1
  • Environment: Development (affects all environments)
  • Asset Pipeline: Propshaft

Problem Description

Using data-turbo-track: "reload" on CSS files causes persistent performance degradation that affects subsequent page requests, even after navigating away from the page that loaded the tracked CSS file.

Symptoms

  1. Normal page loads: 150-250ms
  2. After visiting page with data-turbo-track: "reload": All subsequent pages become 2-5x slower
  3. Performance contamination persists until application restart or cache clearing
  4. Specific symptom: Active Storage image requests jump from ~50ms to 600ms+ after visiting affected routes

Root Cause Analysis

When data-turbo-track: "reload" is applied to large CSS files (300+ lines), Turbo's asset state management becomes corrupted and persists across subsequent requests. This affects:

  • Asset pipeline performance
  • Active Storage request handling
  • Overall Turbo navigation speed
  • Browser asset caching behavior

Reproduction Steps

  1. Create a Rails 8.0.2 application with turbo-rails

  2. Create a large CSS file (300+ lines) with complex styling:

    /* app/assets/stylesheets/pages/heavy_styles.css */
    /* ...300+ lines of CSS with animations, backdrop-filters, etc... */
  3. Add this CSS to a view with reload tracking:

    <!-- app/views/some_page/index.html.erb -->
    <% content_for :head do %>
      <%= stylesheet_link_tag "pages/heavy_styles", "data-turbo-track": "reload" %>
    <% end %>
  4. Test the performance pattern:

    • Visit other pages → Fast (150-250ms)
    • Visit the page with tracked CSS → Slow initially
    • Visit other pages again → Now permanently slow (500ms+)
    • This slowness persists until restart

Expected Behavior

data-turbo-track: "reload" should only affect the asset loading behavior for that specific page, without contaminating the performance of subsequent page requests.

Actual Behavior

Visiting any page with data-turbo-track: "reload" permanently degrades the performance of all subsequent requests until application restart.

Workaround

Remove data-turbo-track: "reload" from CSS files:

<!-- Instead of: -->
<%= stylesheet_link_tag "pages/heavy_styles", "data-turbo-track": "reload" %>

<!-- Use: -->
<%= stylesheet_link_tag "pages/heavy_styles" %>

Impact

  • Development productivity: Developers need to frequently restart servers
  • Production implications: Could affect production apps using asset reload tracking
  • User experience: Degraded performance across the entire application
  • Debugging difficulty: Hard to trace since the cause and effect are separated

Additional Context

This issue appears to be undocumented and may be specific to Rails 8.0.2 with Propshaft and the new asset pipeline. The problem is most severe with large CSS files containing complex styling (animations, backdrop-filters, complex selectors).

The issue was discovered during a Rails 8.0.2 upgrade where multiple mission-planning related views used data-turbo-track: "reload" on a large CSS file, causing systematic performance degradation.

Potential Investigation Areas

  1. Turbo's asset state management and how reload tracking affects internal state
  2. Interaction between Propshaft and Turbo asset tracking
  3. Memory leaks or persistent objects in Turbo's asset monitoring
  4. Browser asset caching conflicts caused by reload tracking

Priority Justification

This issue is critical for Rails 8.0.2 applications because:

  1. Silent Performance Killer: Developers may unknowingly use data-turbo-track: "reload" and suffer mysterious performance issues
  2. Hard to Debug: The cause (visiting a page with tracked CSS) and effect (slow subsequent pages) are separated, making it nearly impossible to trace
  3. Production Impact: Could severely affect production applications using asset reload tracking

Note: After reviewing all current open issues, this bug appears to be completely undocumented, making this report valuable for the Rails 8.0.2 community.

Additional Context - Potential Anti-Pattern

Note: The usage of data-turbo-track: "reload" on large CSS files may be an anti-pattern. However, even anti-patterns should not cause persistent performance degradation that affects the entire application until restart.

Expected behavior for anti-patterns: Poor performance on the specific page using the anti-pattern, but no contamination of subsequent requests.

Actual behavior: Persistent application-wide performance degradation.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions