Intentionally Slow Down HTML/PHP Page Load to Test

Question

I'm curious if there exists a method to intentionally slow the page load?

I'm testing my HTML & PHP pages on my local host right now, and I want to see how my loading gif etc will perform when the page load is slower.

I realize this is a rare request as most developers are only concerned with speeding up page loads, but I thought there might be a method, using either javascript/jQuery or PHP, to do something like this for testing purposes.

Thanks for any help!

Note: I'm testing on MAMP, so that's Apache server running on Mac OS 10.7

Answer 1

A little bit of JS setTimeout can do the trick

setTimeout(function()
{
    // Delayed code in here
    alert('You waited 5 seconds to see me'); // Waits 5 seconds, then alerts this
}, 5000); // 5000 = 5 seconds

Answer 2

you can use sloppy local web proxy to slow down your connection (it's in JAVA, so it'll probably run on your devel machine. You might also want to turn off mod_deflate for testing purposes, if you want so how your browser responds to slow HTML load (for example, dynamicly sized HTML tables, etc)

Also, see this question on webmasters.stackexchange.com

Answer 3

You can use sleep():

<?php
// Delays for 10 seconds.
sleep(10);
?>

...
html here
...

Answer 4

You can use php's sleep($seconds) function to slow down a page load. However, you would need to turn implicit output buffer flushing to "on" with ob_implicit_flush(true); if you want anything to be sent to the user's browser before the page is done being processed. Otherwise your page won't have ANY contents until it's done loading. Calling sleep alone won't do the trick.

Answer 5

This is what I would try: Use a php resource as source of the image:

<img src="images/gifLoager.php" />

in gifLoader.php, read your image file, output it byte by byte with a delay in the loop.

$fp = fopen( $path, 'rb');
while(!feof($fp)) {
        print(fread($fp, 1024));
        flush();
        Sleep(1);
     }
fclose($fp);

Don't forget to appropriately set the headers before outputting the binary data.

Referrences:

http://stackoverflow.com/questions/1563069/stream-binary-file-from-mysql-to-download-with-php
http://php.net/manual/en/function.sleep.php
http://www.gamedev.net/topic/427622-php-and-file-streaming-script-with-resume-capability/

UPDATE 2015-04-09 Use Chrome 'Device Mode': This tool has a network throttling feature that allows you to see how your page may render on a device with a slow network bandwidth. It has many other features that allow you to emulate features on various devices such as screen size and touch.

https://developer.chrome.com/devtools/docs/device-mode

Answer 6

Moussa has the right idea. The best way to test a slow page load is to use Chrome's developer tools. Select the network tab, and then click the dropdown that says "No throttling". Then change the page to your desired speed.

This way is superior to using the sleep function because you don't have to mess with any code and then remember to take it out. If you want to change the speed, just change the throttling level and you're set.

For more information on throttling check out the docs.