Resolve "Specific Async Script Loading by using a Page Variable"

What does this MR do?

It makes it possible to set script loading on a specific page to defer. Simply set @page_defer_javascript to true and all scripts will get the defer="defer" attribute.

Why was this MR needed?

To boost performance already on specific pages. Later on we can reuse the javascript_tag overwrite exactly in the opposite way so all scripts are defer except specific ones.

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• Documentation created/updated
• API support added
• Tests
  • Added for this feature/bug
  • All builds are passing
• Conform by the merge request performance guides
• Conform by the style guides
• Branch has no merge conflicts with master (if it does - rebase it please)
• Squashed related commits together

What are the relevant issue numbers?

Closes #34904 (closed)

app/assets/javascripts/behaviors/requires_input.js

+import _ from 'underscore';
 import '../commons/bootstrap';
 
 // Requires Input behavior
@@ -48,7 +49,9 @@ function hideOrShowHelpBlock(form) {
 
 $(() => {
   const $form = $('form.js-requires-input');
-  $form.requiresInput();
-  hideOrShowHelpBlock($form);
-  $('.select2.js-select-namespace').change(() => hideOrShowHelpBlock($form));
+  if ($form) {
+    $form.requiresInput();
+    hideOrShowHelpBlock($form);
+    $('.select2.js-select-namespace').change(() => hideOrShowHelpBlock($form));
+  }
 });