Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NextCloud is unacceptably slow without asset pipelining #2272

Closed
cdauth opened this issue Nov 23, 2016 · 121 comments
Closed

NextCloud is unacceptably slow without asset pipelining #2272

cdauth opened this issue Nov 23, 2016 · 121 comments

Comments

@cdauth
Copy link

cdauth commented Nov 23, 2016

According to the docs, asset pipelining has been removed in nextCloud 10. While ownCloud/nextCloud has always been very slow, this makes nextCloud extremely slow and practically unusable even on medium-latency connections.

My network connection has ping times of about 250–300 ms to my nextCloud server. This might seem slow compared to a high-speed fiber-glass cable connection in an American metropolis, but it is quite normal for a mobile connection, and in many rural areas in the world the latency is even higher on a cable connection.

I have about 10 non-standard apps installed on my nextCloud instance, and just the front page of the Files app takes anything from 1 minute up to 5 minutes to load (with enabled browser cache)! It tells me that it had to do over 200 requests!

A good web application does 2 or 3 requests to load the page, maybe a bit more for more clever caching, if not all components are needed in all parts of the application.

nextCloud should really:

  • enable asset pipelining again. If it breaks some apps, those apps should be fixed.
  • use image sprites
  • get rid of AJAX requests that load settings and stuff on page load, and instead put that data into the DOM

Here are two screenshots to give a rough idea about what is loading:

image

image

@nickvergessen
Copy link
Member

nickvergessen commented Nov 23, 2016

I agree that we should try to combine stuff more again, but honestly with a server that takes 6 seconds to deliver a 1kb css file... what are you using it for? downloading a 1MB file will take 6k seconds which is over 1 hour? 😨

And as a sidenote: no one of us has an american-metropol-fiberglas-connection.

@cdauth
Copy link
Author

cdauth commented Nov 23, 2016

The problem is really just the latency. Downloading a file works fine with 5–10 MBit/s.

@Guillaume99
Copy link

hello,

Use of asset pipeline have already been discussed here : https://help.nextcloud.com/t/asset-pipeline-enabled-leads-to-a-blank-calendar-with-error/1122/4 and in some other thread.

The conclusion was (more or less) : "asset pipeline is old and broken and (very likely) nothing will fix that. Don't use it."

I think that for now, your best options are HTTP/2 and maybe gzip compression of .CSS and .js ...

@MorrisJobke
Copy link
Member

There was the idea to group JS/CSS based on the app it is loaded from. We maybe look into this once the SCSS PR is in - #1805 - cc @skjnldsv

@cdauth
Copy link
Author

cdauth commented Nov 23, 2016

I think it is important to make a separation between minification and concatination here. In the discussion you are linking, the main argument seems to be that the JavaScript minifier is old and broken. I agree with disabling it then, as an easy solution can be that apps deploy minified JavaScript code, as mentioned in the discussion.

The issue I am facing is not related to a lack minification or compression. It is related to the fact that the browser has to send more than 200 HTTP requests to the server in order to load a page. This problem can only to a small part be solved on an app level. The HTTP standard recommends not to make more than 2 simultaneous connections to a server, and Chrome for example has a hard-coded limit of 6 (see this discussion). HTTP/2 is obviously not a practical solution right now.

If JavaScript files and CSS files (and image sprites) would simply be served concatenated, this would drastically reduce the number of requests and increase performance.

@skjnldsv
Copy link
Member

@MorrisJobke Indeed, we could combine all the css easily.
The #2050 pr implement css compression by default.

@rullzer
Copy link
Member

rullzer commented Nov 23, 2016

I agree we can improve here. But, havigng said that, the problem should not be that huge. Basically the first page load is painfully slow then. But after that 99% of the assets should be cached anyways.

@eppfel
Copy link
Member

eppfel commented Nov 23, 2016

HTTP/2 is obviously not a practical solution right now.

@cdauth Maybe not right now, but... Browser support: http://caniuse.com/#feat=http2 Server adoption: http://isthewebhttp2yet.com/measurements/adoption.html

@cdauth
Copy link
Author

cdauth commented Nov 24, 2016

@eppfel: Oh, I must admit that I thought browser support was far less advanced. I was under the impression that HTTP/2 is so far only supported by Chrome when enabling a certain flag.

Will look into it and see how much it improves things.

@eppfel
Copy link
Member

eppfel commented Nov 24, 2016

@cdauth It's actually only supported over TLS (https). Here is a great article about it: https://www.troyhunt.com/i-wanna-go-fast-https-massive-speed-advantage/ But using nextcloud over an insecure connection is not a good idea anyway.

@cdauth
Copy link
Author

cdauth commented Nov 27, 2016

Okay, I enabled HTTP/2 on my server and the speed improvement is tremendous.

I am undecided whether I think asset pipelining is still necessary.

I think some improvements can still be made (such as avoiding AJAX calls on page load, for example to load the config).

HTTP/2 should definitely be mentioned in the Server Tuning docs.

@eppfel
Copy link
Member

eppfel commented Nov 27, 2016

@cdauth Lucky you, don't have that option, right now.

I think some improvements can still be made (such as avoiding AJAX calls on page load, for example to load the config).

Totally agree 👍

HTTP/2 should definitely be mentioned in the Server Tuning docs.

You could do it yourself 😉

@eppfel
Copy link
Member

eppfel commented Dec 1, 2016

As HTTP2 is coming, asset pipeline will get obsolete. I don't know if image sprites or CSS compression would still be worth the effort, but I would advise opening dedicated issues and closing this one.
I moved @cdauth's proposal to get rid of some AJAX calls to #2447 and added documentation for HTTP2 in the documentation nextcloud/documentation#242

@ddeenniiss
Copy link

Fresh install on a new server, open Files -> it's 208 requests (!) and 6 sec to load the page ... Just crazy ...

@imraro
Copy link

imraro commented Dec 15, 2016

1Gbps, 0.3 ms latency (LAN Connection)
Firefox 50.0.2 x86_64, http/2

NextCloud 11
nginx-1.10.2
php-7.0.14
php-pecl-apcu-5.1.7
mariadb-5.5.52

Performance analysis of files page:

empty_cache
primed_cache

@HolgerHees
Copy link
Contributor

the same for me with chrome 55.

http2 is enabled together with gzip compression.

NextCloud 11
php-5.6.29
mariadb-10.0.28

first request:
noncache

and second cached request:
cache

@cinemast
Copy link

cinemast commented Dec 19, 2016

Loading times are in fact awful atm. I think some form of concatenation is really needed here.
I agree that the previous asset pipeline was broken, but I think there must be some form of replacement for it.

HTTP2 won't fix that issue, it is just not as dramatic as with HTTP/1.x.

This snippet containing css/js resources was taken from the current nextcloud demo server setup:

	<link rel="mask-icon" sizes="any" href="/core/img/favicon-mask.svg" color="#0082c9">
					<link rel="stylesheet" href="/core/css/styles.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/inputs.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/header.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/icons.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/fonts.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/apps.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/global.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/fixes.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/multiselect.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/mobile.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/vendor/jquery-ui/themes/base/jquery-ui.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/jquery-ui-fixes.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/tooltip.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_pdfviewer/css/style.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/share.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_versions/css/versions.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_videoplayer/css/style.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/gallery/css/slideshow.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/gallery/css/gallerybutton.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/notifications/css/styles.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/jquery.ocdialog.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files/css/files.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files/css/upload.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files/css/mobile.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files/css/detailsView.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_trashbin/css/trash.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/activity/css/style.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/comments/css/comments.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_sharing/css/sharetabview.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_texteditor/css/DroidSansMono/stylesheet.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_texteditor/css/style.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/files_texteditor/css/mobile.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/vendor/select2/select2.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/core/css/systemtags.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
					<link rel="stylesheet" href="/apps/systemtags/css/systemtagsfilelist.css?v=9a4ae11b328522aeca1e715f0a55b5b4">
									<script src="/index.php/core/js/oc.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/jquery/dist/jquery.min.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/jquery-migrate/jquery-migrate.min.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/jquery-ui/ui/jquery-ui.custom.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/underscore/underscore.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/moment/min/moment-with-locales.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/handlebars/handlebars.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/blueimp-md5/js/md5.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/bootstrap/js/tooltip.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/backbone/backbone.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/es6-promise/dist/es6-promise.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/davclient.js/lib/client.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/clipboard/dist/clipboard.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/placeholders.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/compatibility.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/jquery.ocdialog.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/oc-dialogs.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/js.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/l10n.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/octemplate.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/eventsource.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/config.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/search/js/search.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/oc-requesttoken.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/apps.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/mimetype.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/mimetypelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/snapjs/dist/latest/snap.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/backbone/backbone.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/oc-backbone.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/placeholder.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/jquery.avatar.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_pdfviewer/js/previewplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/shareconfigmodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/shareitemmodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialogresharerinfoview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialoglinkshareview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialogmailview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialogexpirationview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialogshareelistview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/sharedialogview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/share.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_videoplayer/js/viewer.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/vendor/bigshot/bigshot-compressed.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/vendor/dompurify/src/purify.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/galleryutility.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/galleryfileaction.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/slideshow.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/slideshowcontrols.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/slideshowzoomablepreview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/gallery/js/gallerybutton.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/notifications/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/notifications/js/notification.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/files/fileinfo.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/files/client.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/file-upload.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/newfilemenu.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/jquery.fileupload.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/jquery-visibility.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/fileinfomodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/filesummary.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/breadcrumb.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/filelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/search.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/favoritesfilelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/tagsplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/gotoplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/favoritesplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/detailfileinfoview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/sidebarpreviewmanager.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/sidebarpreviewtext.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/detailtabview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/mainfileinfodetailview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/detailsview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/handlebars/handlebars.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/fileactions.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/fileactionsmenu.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/files.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/keyboardshortcuts.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files/js/navigation.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_sharing/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_sharing/js/sharedfilelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_trashbin/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_trashbin/js/filelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/activity/js/formatter.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/activity/js/activitymodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/activity/js/activitycollection.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/activity/js/activitytabview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/activity/js/filesplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/oc-backbone-webdav.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/commentmodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/commentcollection.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/commentsummarymodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/commentstabview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/comments/js/filesplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_sharing/js/share.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_sharing/js/sharetabview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_texteditor/js/editor.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_texteditor/js/vendor/ace/src-noconflict/ace.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_versions/js/versionmodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_versions/js/versioncollection.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_versions/js/versionstabview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/files_versions/js/filesplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/vendor/select2/select2.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/select2-toggleselect.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/systemtags/systemtags.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/systemtags/systemtagmodel.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/systemtags/systemtagsmappingcollection.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/systemtags/systemtagscollection.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/core/js/systemtags/systemtagsinputfield.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/systemtags/js/app.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/systemtags/js/systemtagsfilelist.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/systemtags/js/filesplugin.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					<script src="/apps/systemtags/js/systemtagsinfoview.js?v=9a4ae11b328522aeca1e715f0a55b5b4"></script>
					</head>

@cdauth
Copy link
Author

cdauth commented Dec 19, 2016

In fact, with nextCloud 11, loading times have gone up a lot again, despite HTTP/2. On a low-latency connection where loading times with HTTP/2 were maybe around 4–6 seconds before, they are now around 15 seconds.

@utahbmxer
Copy link

I too have noticed drastic increase in overall load times since upgrading to NC 11, not just the initial page. 217 requests, 3,599.67KB, 25s on WiFi LAN, drops to about 15seconds on 1GB wired LAN connection.
Running CentOS 7 and PHP7, haven't figured out an easy way to enable HTTP2 without building from source which I am not really leaning towards.

@ChristophWurst
Copy link
Member

ref #1066

@Gomez
Copy link
Member

Gomez commented Jan 5, 2017

I noticed this really slow load, too. If you are used to NC10 this will prevent you form upgrading to NC11.

For me this only happens on Firefox (Version 50.1.0) 8.5 sec loading with cache. With Chrominum ( Version 55.0.2883.87) it loads in 2.9 seconds.

@LEDfan
Copy link
Member

LEDfan commented Jan 8, 2017

I'm experiencing the same problem. (it has become worse since NC 11).
selectie_028

It aren't the PHP requests which are slow (they are fast!) but it's my browser waiting for all the JS and CSS files to load. The screenshot was taken with a fresh profile of Firefox. When the CSS and JS are loaded and you click on a directory in the files app this is very fast. It's just loading all the css and js which is sad because off all the work on the speed up of the PHP side....

I noticed there are some files with 4-5 lines of code and a license header. Also the files aren't minimized or comments are removed. Will it get better because of #1786 ? Especially the compression part. Maybe the same can be done for the JS?

@skjnldsv
Copy link
Member

skjnldsv commented Jan 8, 2017

@LEDfan Did you try the scss integration? If so did you find some improvements?
The js compression could be done yes. The same way the scss function works. Could you work on this?

@nickvergessen
Copy link
Member

Well I guess the main reason is the number of files, more then what the content of the files is. Although improving both should help twice.

@webermax
Copy link

webermax commented Jan 9, 2017

NC 11 indeed is incredibly slow and not usable in production anymore.

Furthermore it took me more than an hour to notice that mod_pagespeed is disabled via .htaccess.
XSS protection is fine, but the way it is implemented seems to break simple performance optimizations.

@eppfel eppfel added the high label Jan 9, 2017
@MorrisJobke
Copy link
Member

XSS protection is fine, but the way it is implemented seems to break simple performance optimizations.

cc @LukasReschke

@LINKIWI
Copy link

LINKIWI commented Mar 19, 2017

IMHO parallel loading of the current mass of js/css is a reasonably good quick-fix.
It yields, depending on link latency, a factor of ~3x with pipelinig http/1.1, http/2 yields another factor of ~2.

This is really not a solution. It is, at best, an attempt to work around the core problem by over-optimizing another layer of the application stack.

I don't disagree with the claim that gzip compression and HTTP/2 help overall performance, but these optimizations do not address the actual problem. The problem here is the absence of module bundling, which goes against every reasonable and sane principle of designing performant client-side SPAs. Tools like webpack and countless CSS minifiers exist for exactly this purpose.

@michaelletzgus
Copy link
Contributor

@LINKIWI

This is really not a solution. It is, at best, an attempt to work around the core problem by over-optimizing another layer of the application stack.

Full Ack, That's why I called it "nice-to-have" and "quick-fix" :-)

Module bundling? Yes, but f we need "module tidy out"! More than 1 MB (uncomressed) js code - this is enough for an whole operating system. ;)

@MightyCreak
Copy link

I agree with @rom1dep. I have my own server, but since I installed stable Debian on it, on which nginx's package doesn't handle http/2, and that there are quite a few services running at the same time, I just can't update my server to testing just like that.

Because of that and that I guess I'm not the only one in this situation (as @rom1dep pictured), it would really be nice to have a proper fix on the app side. For sure, HTTP/2 will always be a nice to have, but if Nextcloud doesn't handle this problem seriously, it will only hide it under the rug.

@LukasReschke
Copy link
Member

Nextcloud 12 will allow combining JS in apps as per #3988, and also CSS merging.

@korelstar
Copy link
Member

@LukasReschke Did you (or someone else) made some evaluation (performance measurement) that shows that #3988 is sufficient for everybody and #3696 is really not needed anymore?
Maybe, combining both approaches would provide further enhancement.

@michaelletzgus
Copy link
Contributor

michaelletzgus commented Mar 25, 2017

Testing the JS Combiner (current master, 4ea79a5) by hard reloading the files app with Firefox 52.
Enabled apps:

  • admin_audit: 1.2.0
  • admin_notifications: 1.0.0
  • calendar: 1.5.2
  • comments: 1.2.0
  • contacts: 1.5.3
  • dav: 1.2.0
  • deck: 0.1.1
  • federatedfilesharing: 1.2.0
  • federation: 1.2.0
  • files: 1.7.2
  • files_external: 1.3.0
  • files_external_sia: 0.1.0
  • files_markdown: 1.0.1
  • files_opds: 0.8.2
  • files_reader: 1.0.1
  • files_sharing: 1.2.0
  • files_trashbin: 1.2.0
  • files_versions: 1.5.0
  • issuetemplate: 0.2.1
  • lookup_server_connector: 1.0.0
  • nextant: 1.0.6
  • notes: 2.2.0
  • ownbackup: 17.3.0
  • passman: 2.1.1
  • previewgenerator: 1.0.5
  • provisioning_api: 1.2.0
  • rainloop: 4.28.1
  • registration: 0.2.3
  • sharebymail: 1.1.0
  • spreed: 1.2.0
  • spreedme: 0.3.8
  • systemtags: 1.2.0
  • tasks: 0.9.5
  • theming: 1.3.0
  • twofactor_backupcodes: 1.1.0
  • twofactor_totp: 1.1.0
  • twofactor_u2f: 1.1.0
  • updatenotification: 1.2.0
  • workflowengine: 1.2.0

Results:

(1) debug=true (no js combine) =>"classic"
198 total requests, 3.4 MB, 26 sec
123 js requests, 2.9 MB, 21 sec

(2) debug=false (js combine enabled) =>"combined"
117 total requests, 3.4 MB, 8.5 sec
42 js requests, 2.9 MB, 5.7 sec

(3) debug=false (js combine enabled) with additional deferdark magic =>"combined dark magic"
116 total requests, 3.3 MB, 4.5 sec
42 js requests, 2.9 MB, 2.1 sec

(4) deferdark magic only =>"dark magic"
197 total requests, 3.4 MB, 6.5 sec
123 js requests, 2.9 MB, 4.2 sec

One XHR request is missing in (3) due to a problem with the files markdown app, see #3696.

Chromium needs ~4 sec in either case.

@benediktg
Copy link
Member

So I would say we need both. 😉

@LukasReschke
Copy link
Member

LukasReschke commented Mar 25, 2017

I'm still very much against this, this changes a core behaviour and has the potential to break apps. This changes the behaviour of loaded JavaScript totally and may make some stuff (e.g. apps that do redirects) even break totally.

👎 – Sorry 😉

@michaelletzgus
Copy link
Contributor

michaelletzgus commented Mar 25, 2017

The only reproducible problem I observed so far is the one with files_markdown mentioned above.

If we manage to combine all scripts there should be virtually no difference between "combining" and "dark defer magic". Combining does not rely on the transport protocol an the correct implementation of defer - but adds more complexity to the NC code and maybe higher load to the server.

So far - I don't know what is really better...

@LukasReschke
What do you mean with redirecting apps?

@korelstar
Copy link
Member

Maybe, the new combination approach can still be enhanced. According to the tests by @michaelletzgus, the approach decreased the number of requests from 198 to 117. However, 117 is still very much. Is the approach not yet applied consequently enough or is there something which prevents the number of requests to go down to below, e.g., 20 requests?

@btk999
Copy link

btk999 commented May 23, 2017

@michaelletzgus thanks for your approach! It worked fine on my nextcloud 11.0, but i updated to 11.0.3 and now my instance is slow again. How can i apply your patch on nextcloud 11.0.3?

@HolgerHees
Copy link
Contributor

just update to nextcloud 12 and everything works fine.

@michaelletzgus
Copy link
Contributor

Native 12 does not include the defer mechanism, this is scheduled for 13.

You can patch your 11 or 12 instance by downloading pull 4854 as a patch:
cd <base directory of nextcloud>
wget https://patch-diff.githubusercontent.com/raw/nextcloud/server/pull/4854.patch

Then apply the downloaded patch file to your instance:
patch -p1 < 4854.patch

@enricotagliavini
Copy link

Thank you very much for this work. I'm still on NC11 and this makes a big difference. FYI 4854 doesn't apply cleanly on NC11 as a few lines in the layout.{base,guest,user}.php are in a different order. Easy to fix by hand though.

I guess the best option, for who can, is to hop and upgrade to NC12 ASAP. If I understand correctly NC12 includes JS combine work. If this is applied on top of it the benefit should be even bigger.

@benediktg
Copy link
Member

benediktg commented May 31, 2017 via email

@nachoparker
Copy link
Member

nachoparker commented Jul 26, 2017

Everyone, thanks for working on this. It is indeed needed to improve loading times.

Maybe many of you are on powerful computers or VPS, but just imagine being on lower end hardware, such as a Raspberry Pi. Think NextCloudPi/Nextcloudbox

From NextCloudPi, we are going steady for 1000~2000 downloads a day, which means at least hundreds of people trying Nextcloud everyday on SBCs. I get many complaints on how slow it is and I can tell that really puts people off. Many decide to stay with Dropbox for this reason.

This screenshot was taken from a NextCloudPi instance on a Raspberry Pi 2 after logging out and logging in again, so browser cache, PHP7, PHP cache, HTTP2 pipelining... and all the stuff

nc-slow

I develop and test on a QEMU ARM virtualized system... just imagine the pain x_x

I am glad to see movement on the right direction. This is just to make you guys aware of this user base that you might not be aware you have.

Good work, and please, don't forget users on low end devices!

edit: I know its a 35$ board, but as someone mentions before, it is quite capable of serving dynamic pages, and I've seen it load faster on PHP5 + owncloud than it does now, so the design can be improved (it is being improved already it seems)

@marcosmatas
Copy link

Hey nachoparker. I didn't know the existence of your project (Nextcloudpi). I installed first owncloud and now nextcloud in my pi2 first and now in my pi3. I suppose that are a lot of people that install nextcloud in this machines for a single use. The server is cheap and the power consuption is very low.

For a perfect personal pi server i think that the project need a mail server. I installed iredmail to make the pi a full server, but i love the simplicity of mail-in-a-box. Please, consider this in future relases.

And yes... when the assets were enabled in previous versions, owncloud was very much faster that now in this machines. I think that this might be solved as soon as possible (is a know error and very evident to forget it).

@nachoparker
Copy link
Member

Nice suggestions! I also want to add email self hosting to the whole thing, but haven't even started investigating.

Would you like to open a feature request / discussion here?

@btk999
Copy link

btk999 commented Aug 12, 2017

Hi guys,

i applied 4854.patch to my nextcloud 12.0.0, but this makes updating to 12.0.1 impossible.
How can i remove the patch or is there an updated version that works with 12.0.1?

@aronovgj
Copy link

Hi guys,

i applied 4854.patch to my nextcloud 12.0.0, but this makes updating to 12.0.1 impossible.
How can i remove the patch or is there an updated version that works with 12.0.1?

I removed the patch file in the NC directory and the update went well. I guess you'll have to reapply the patch after update though.

@enricotagliavini
Copy link

Sorry to resume this old thread. This is also not a direct issue of Nextcloud, but it's related. Just want to point out I think HTTP/2 is not really an option at the moment. I've tried with nginx and found it's not ready. HTTP/2 large downloads will simply deadlock. This is not a fault of nextcloud, it's the same with static files if they are big enough (>10 MB can be enough, but it's easier to see with > 100 MB or more).

Apache httpd works, but connection multiplexing doesn't work as I expected. When downloading a large file it's not possible to navigate nextcloud pages. I think (but am not sure at all) this is due to connection multiplexing in HTTP/2, which is done kind of incorrectly in this case. The new requested seems to wait for the big download to finish, but it's supposed to happen concurrently.

@benediktg
Copy link
Member

@enricotagliavini Downloading a 112 MB file worked pretty fine here (with nginx 1.13 and HTTP/2).

@nachoparker
Copy link
Member

I have been using HTTP2 apache for many months, and it seems very much ready from here :P

@enricotagliavini
Copy link

@nachoparker so you can download a 10 GB file while surfing to other nextcloud pages at the same time? Which version of apache httpd if I may ask?

@ChristophWurst
Copy link
Member

Could you please move this discussion to the forum or (if there's a bug) to a new issue? Everyone in this thread will be notified by your comments although it's been fixed. Thanks.

@nextcloud nextcloud locked and limited conversation to collaborators Oct 23, 2017
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests