I'll summarise. Please correct me wherever I was not able to phrase my question correctly.
I have a few PHP pages, all of them have the following format:
<?php
include "header.php";
?>
INSERT PAGE SPECIFIC MATERIAL HERE
<?php
include "footer.php" ?>
header.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!-- Main CSS -->
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<navmenu></navmenu>
footer.php
<footer></footer>
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<!-- Theme JavaScript -->
<script src="js/main.js"></script>
</body>
</html>
I am new to PHP and not sure if this is the correct way to efficiently structure my PHP files because my concerns are:
Would appreciate it if you can give some advice!
Should I separate my main.js, style.css, header.php and footer.php so that each PHP page loads the minimum amount needed for the body functions?
You should create ONE css file and ONE js file for your entire web site. don't use php file act as css because:
If you have high visited web site, It's better to have ONE css and js file. Because It's a direct file. but when you are creating css or js by php file, php need to calculate. Maybe you think it's fast calculation, but if you need a good performance on high visited web site, it matters.
If you create css and js file by php, sometimes you need to import multiple js or css file. Who knows? maybe it makes you to use 10 js and 10 css inside your head tag! and It's bad for SEO.
Don't worry about one css or js file size. It's better with lower size but you can still create 100KB css or js file without SEO problem.
You can have one css file for all media. print included. Doesn't matter you are using multiple or single file, always use @media print{}
inside the same file if you need it.
ONE css and js file can be globally cached. even if you don't need the css or js file, the global css and js file are already cached.
I'm not saying ONE css and js file is always great idea but it has the most benefit.
If you want to reduce the ammount of css/js on your page, then you can do something like this... Call your CSS with:<link rel='stylesheet' type='text/css' href='css/style.php' />
Inside style.php it would look like something like this:
<?php
switch(basename($_SERVER['PHP_SELF'])){
case 'index.php':
echo 'CSS code for index.php gos here';
break;
case 'login.php':
echo 'CSS code for login.php gos here';
break;
}
?>
Unless you've got like lots of styling and javascript which is confirmed to be seriously increasing load time, then it's fine and I wouldn't do the above.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With