[openstreetmap/openstreetmap-website] Infinite scroll - Issues page (PR #5033)

[David Tsiklauri]

This PR addresses heavy calls and long load time of the Issues page. Problem was mentioned in https://github.com/openstreetmap/openstreetmap-website/pull/4990 by @AntonKhorev.

Added infinite scroll functionality. On the first load, there will be only loader and after that, every time loader will be shown on the screen, new 50 issues will be called and displayed. In terms of performance, locally I have 1000 users and 1000 issues. First load time was decreased from ~8s to ~1s, and after that every call for the next 50 issues takes ~150ms. In real environment, it will have much better improvement, as instead of searching for 30000 issues, it will take only 50 (in theory, the difference should be 30x better in the real environment, then it is on my local machine).

Video:

https://github.com/user-attachments/assets/33254baf-f553-4a27-8b3e-9ce651a08c53

Issues not found:

![image](https://github.com/user-attachments/assets/ea28ad5e-aeb0-4ae9-aa64-e337e1c72b6f)

User not found:

![image](https://github.com/user-attachments/assets/95695949-3136-4e41-a9c5-e91de6e8c3e5)


You can view, comment on, or merge this pull request online at:

  https://github.com/openstreetmap/openstreetmap-website/pull/5033

-- Commit Summary --

  * Infinite scroll issues page

-- File Changes --

    M app/abilities/ability.rb (4)
    A app/assets/javascripts/issues.js (48)
    M app/controllers/issues_controller.rb (11)
    A app/views/issues/_page.html.erb (28)
    M app/views/issues/index.html.erb (52)
    M config/locales/en.yml (13)
    M config/routes.rb (3)
    M test/system/issues_test.rb (33)

-- Patch Links --

https://github.com/openstreetmap/openstreetmap-website/pull/5033.patch
https://github.com/openstreetmap/openstreetmap-website/pull/5033.diff

-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/5033
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/5033 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20240730/6f3ad1d4/attachment.htm>