How to optimally and effectively place client JS-scripts in PHP-pages?

Are there any optimal and effective ways to add JS scripts to the pages generated by PHP?

So far I have managed to find only one recommendation applicable to WordPress. In another article, the author suggests using some kind of <?php insertScript("menu.js") ?> , but does not provide its code.

I will give an example: my test site has three pages: index.php, orders.php and users.php. Each of the pages requires the connection of the obligatory Bootstrap 4 scripts, which should be placed at the bottom of the page before the </body> tag to be closed.

Here and further, I removed the type="text/javascript" attribute to make it shorter.

  <!--основные скрипты Bootstrap 4--> <script src="js/jquery-3.2.1.slim.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> </body> </html> 

Further requirements vary. In addition to the main scripts, each of the pages "wants" has its own script: index.js, orders.js or users.js, which can go either before or after the main scripts. For example, this is how the scripts should look in the users.php page:

  <!--скрипт HASH-функций--> <script src="js/sha512.js"></script> <!--основные скрипты Bootstrap 4--> <script src="js/jquery-3.2.1.slim.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> <!--скрипты только для этой страницы или другие скрипты--> <script src="js/myengine.js"></script> <script src="js/users.js"></script> </body> </html> 

Well, let's complicate an example: in the orders.php page there will be links to other scripts and also the script itself that performs actions when loading a document. This script should be the latest. The bottom of the orders.php page looks like this:

  <!--мой собственный скрипт--> <script src="js/blahblah.js"></script> <!--основные скрипты Bootstrap 4--> <script src="js/jquery-3.2.1.slim.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> <!--скрипты Bootstrap DataTables--> <script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap4.min.js"></script> <!--скрипты только для этой страницы или другие скрипты--> <script src="js/myengine.js"></script> <script src="js/orders.js"></script> <!--ну, и бонус--> <script> $(document).ready(function() { $('#example').DataTable(); } ); <script> </body> </html> 

Here's how to write all this correctly in every page?
Dynamically. Right. Optimally. Effectively.

Generate it all through include 'inc/footer.php'; not quite convenient and completely (I think) wrong, because the content in the footer is static.

Another grouping of scripts according to their purpose and the creation of simple functions in an include file. For example, the file clientscripts.php:

 <?php function mainBootstrapScripts() { ?> <!--основные скрипты Bootstrap 4--> <script src="js/jquery-3.2.1.slim.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> <?php }; function dataTablesBootsrapScripts() { ?> <!--скрипты Bootstrap DataTables--> <script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap4.min.js"></script> <?php }; ?> 

But there are single scripts that can not be grouped. Then, in fact, on each script to write a separate PHP-function?

You can also create a large PHP function that takes an array as a parameter: clientScripts(['coreBS4scrips', 'BS4DT', 'users.js']); This option seems to me the most optimal. Only while it is not clear how to observe the sequence and not to break the dependency.

Are there any best practices?
How is all of this managed in large projects?