Debug/analyze Script ContentModule-built.js

Using Neos & Flow
1

Hello,
I hope, someone in Forum has experience with debugging/analyzing js-files from Neos, especial with the ContentMoudle-build.js. I have problem with loading-time in Backend for websites within a lot of Tag-Elements.

The Timeline from Google’s Chrome Dev-Tools show at least a long time for “Timer Fired” and “Function Call”.
Maybe I have to use an un-minify version of ContentModule-built.js to get more meaningful information from Timeline, then:

  • Timer Fired (ContentModule.built.js? bust=a734faf43d5d:422) | Popup-Info: 35.05s (self 0.14s)
  • Function Call (ContentModule.built.js? bust=a734faf43d5d:422) | Popup-Info: 35.05s (self 0.74s)
  • and all the listed anonymous function (scripting(children)) with big time-consuming but without linenumber…

This area/scriptCalling is the most time-consumed element. There are a lot of others in the first 30 seconds of loadingTime. But first I will try to find the worst cause of the slowDown-bottleNeck, or Idle-time-trigger …

Could someone give helpful informations/advices? Hints if I’m on a totally wrong track are also welcome.

printScreenTimeLine_web.jpg1000×669 195 KB

2

There’s a configuration setting called TYPO3.Neos.userInterface.loadMinifiedJavaScript you can set to false to enable easier debugging.

1 Like
3

@aertmann thank you!
And apologize the stupid simple question. But my backend for the particular website is such extremely slow, try&error is not cause nearly …
So, not to wait every time more than 2 and a half minutes for try a «different settings experiment» I ask in Forum:
Your [quote=“aertmann, post:2, topic:1271”]
There’s a configuration setting called TYPO3.Neos.userInterface.loadMinifiedJavaScript you can set to false
[/quote]
means this:

#root/Configuration/Settings.yaml


TYPO3:
  Neos:
    userInterface:
      loadMinifiedJavaScript: FALSE
  Imagine:
    driver: ...
  ...

Or do I have to set it in an other File or Configuration-context?

4

Sorry,
but how do I even try it, there is no change in Code of:
«Packages/Application/TYPO3.Neos/Resources/Public/JavaScript/ContentModule-built.js»

It is still compressed also with use of yaml-config like above. Try with same value in new created file under
«/Configuration/Development/Settings.yaml» within same configuration: has no impingement.

Can’t find any help with google or in forum, neither for

  • how to use the

(maybe the yaml-setting above is totally wrong)

nor

  • in wich file I have to use …

In Docu there are a lot of sub-files listed to define settings. Maybe I have to use the View.yaml.
Unfortunately there are a lot of information, of corse nothing about «loadMinifiedJavaScript» or «userInterface»-is-to-use-in-…

I have found in SourceCode also the class ShouldLoadMinifiedJavascriptViewHelper under
«/Data/Temporary/Development/Cache/Code/Flow_Object_Classes/TYPO3_Neos_ViewHelpers_Backend_ShouldLoadMinifiedJavascriptViewHelper.php»

Derived from this code, maybe for backend, I have to use an other configuration-setting-property? But I find no instructions on whether and how I have to use this.
A lot of possibilities to make something thoroughly wrong, without error-messages or helping instructions to get through.

###Question:
Could someone give a hint, where I can find information to, or as I use it correctly, so that ContentModule-built.js will not be compressed in Backend and outputs line numbers to better cope in debugging?

5

Hey,

so you can override the configuration setting in your own Settings.yaml and yes it is the one you mentioned. The result should be that the backend loads a lot of single files instead of just the one minified. So then you should be able to debug.

6

@christianm thanks: now it works.
The many Scripts were included.

But the countless of functions and the many dependencies, … are an (at least temporary) abandonment for my skills.

  • each @ jquery-with-depenendcies.js:562 has Warning: Not optimized: Optimized too many times
    self time 3.11ms > Total Time 1.1min
  • create @ ember.js:15491 has Warning Not optimized: Inlining bailed out
    self Time 0 > Total Time 32.19ms but countless times from 10’000ms to 80’000ms from 90’000ms in total.
    Same for
  • _createEntityWrapper@NodeSelection.js:30 has Warning Not optimized: Inlining bailed out
    self Time 0.15 > Total Time 32.72ms but countless times from 10’000ms to 80’000ms from 90’000ms in total.
  • And so on …

Tooooo many nesting functions, warnings and too less knowledge to find the bottleneck – or maybe the thousands bottlenecks.

It’s just a gut-feeling, but the

  • site (between the backend-editing tabs) is loading within less then 1 sec(fast and without problems/errors),
  • than there is a reeeaaaaally long pause … The Browser (Chrome, Firefox, Opera, Safari) seems to do nothing. Also the orange loading bar in the top has no move.
  • after this, it looks like the backend would get any push (until around loading-time: 78 sec [from total ~82sec]), the loading bar moves on and the tabs appears in fraction of a second.
    (when «Apply«-Button is used for save some changes: REloading-time: 134 sec [from Total ~137s])

Maybe there is only a small hook, where everything hangs/delays!?
But for me currently not solvable. Hope on updates from Neos, JS-Frameworks, …

7

Will probably be the culprit. I think we did some optimisations on that before… Need to check.

8

Maybe @dimaip has some insight here, he’s previously mentioned having issues with pages with a lot of content elements and Aloha initialization.

1 Like
9

Thank you @aertmann,
Probably the topic is named incomprehensible for this challenge. Maybe other neos-user (also @dimaip) have stumbled over the same problem and have found a solution/work around for it.
But not read about «ContentModule-built.js» or «speedUp Backend». Maybe is better to find for solution-helper and seeker (with same problem) under your notation «Problem with pages with a lot of content elements and Aloha initialization».