•  
      request #9320 Improve performances of the front end
    Infos
    #9320
    Stephane Begaudeau (sbegaudeau)
    2020-01-23 17:02
    2016-07-08 14:25
    9601
    Details
    Improve performances of the front end
    Tuleap can take quite some time to load the user interface, here are some key points that could be improved:

    1- Number of requests
    In order to load my planning view, Tuleap makes 51 requests to the server, among them, there are 1 html page, 19 javascript files, 18 css files, some resources (images, fonts, etc) and a couple of XMLHttpRequests. All the JavaScript files and the CSS files could be concatenated to have only one of each in order to reduce the number of requests.

    2 - Usage of the compression
    Using gzip compression, you could reduce the size of the Javascript and CSS downloaded by about two thirds (1.2MB). The use of gzip on some files like planning-v2.js could save 370KB (which is almost the size of 15 of your other JavaScript files).

    3 - Use browser caching
    None of your Javascript files, CSS files or font is cached by the browser, including files which will not change like jquery-2.1.1.min.js or bootstrap-tooltip.js etc. On top of the two previous pieces of information, this could speed up dramatically the user experience for a Tuleap user.

    4 - Optimize the order of the styles and scripts
    Most of your Javascript and CSS files are in the document head, in order to improve the performances of the loading of the page, you should include external CSS before external Javascript and include the Javascript at the bottom of the body.

    5 - Minimize all your Javascript and CSS code
    All your Javascript and CSS files are not minimized, as such files like "themes/FlaminParrot/js/motd.js" or "project-privacy-tooltip.js" may have most of their content composed of comments then code. Most of the bootstrap code is not minimized too (button, dropdown, modal, popover, tooltip) and some of the JQuery code too.

    6 - Usage of your CSS
    Most of the content of your CSS files is not used by your site, you could trim some of the CSS to reduce the size of your CSS file and speed up the loading of your pages.


    You can find attached to this issue a HAR file with the trace of the loading of the planning view of tuleap.net which you can analyze using the website http://www.softwareishard.com/har/viewer/. I have found those issues on both tuleap.net and on tuleap.eclipse.org.
    UX/UI
    8.16
    Empty
    • [ ] enhancement
    • [x] internal improvement
    Empty
    Stage
    Empty
    Closed
    2020-01-23
    Attachments
    References
    Referenced by request #9320

    Follow-ups

    User avatar

    Most if not all those are covered since a while now on Planning and in new TaskBoard. Closing


    • Status changed from New to Closed
    • Close date set to 2020-01-23
    User avatar

    Thanks for the feedback, it confirms our feeling. The cache seems to have a strong impact on high latency servers.

    User avatar
    Hi Manuel,

    The reverse proxy seems to dramatically improve the performances of tulip.eclipse.org. I used to see it load in 20/30s sometimes and now it seems to load always in 2/3s. Thanks for this quick fix :)
    User avatar

    Stephane,

    Until all the work is completed on frontend end I setup a reverse proxy for cache & compression on tuleap.eclipse.org. Do you seen any improvement on your end ?

    User avatar
    last edited by: Manuel Vacelet (vaceletm) 2016-07-08 16:24

    Hi Stephane,

    Thanks for pointing that out. There is a work already started for a better management of JS assets at art #9299 that comes will partially address point n°1 (for JS), point n°2 & 3 (caching / gziping of assets).