Question on web design. How would you do it? - Tech Support Forums

yomama · August 13th, 2002, 12:08 PM

I have a question about web design in regards to getting the pages to load quickly. For reference you can take a look at www.priorityelectronics.com (good friend of mine).

In general a page can be broken into 3 parts, the head, the body with the buttons on the side in my case, and the bottom which includes a few links, the address, and some CC information.

Now, my buddy uses js. Scripts to pull up those portions of the page (top and bottom). Im still leaning here, but I guess this makes it faster when going from page to page and also the source is a bit simpler. Faster cashing I think.. right?

Are there any comments on this strategy? If I just made each page as one part wouldn’t the pages still cash the same? What strategy would you use in building a similar site to this one?

Thanks for any help!

qball · August 13th, 2002, 11:08 PM

first, pronounced 'cash', spelled cache. no biggy.

[quote]
In general a page can be broken into 3 parts, the head, the body with the buttons on the side in my case, and the bottom which includes a few links, the address, and some CC information.
[quote]

Not really, why can't page be 5,6,7 parts:

1 head
2 body
3 scripts
4 objects (buttons, dropdown, editbox)
5 graphics

The point being, the page is everything between:

Code:

<html></html>

The head isn't sent seperately from body.

Now, I don't know if browser even caches javascript, because if it did, all you would need is:

Code:

<SCRIPT SRC="favorites.js">...</SCRIPT>
<script SRC="bottomtext.js">...</script>
<script SRC="top.js">...</script>

In the first page the user requests, and not every page that uses any of the javascript. You can prove this by running multiple browser windows at same site. Each browser will have to dload any .js src. Any page without:

Code:

<script SRC="*.js">...</script>

Will not 'work'.

Think about it this way:

I go to:

www.priorityelectronics.com

obviously my broswer dloads the 3 .js files. I close browser. Now, priorityelectronics updates one or more of the .js files. Three days later, I go to:

www.priorityelectronics.com

Which 'version' of .js files will my browser use?

The cached version from 3 days ago?
The new ones?

Iffin you running www.priorityelectronics.com, which 'version' do you want me to use?

Relying on browser caching for performance, is problematic. Should probably find better way to make 'request', 'response' work more efficiently on SERVER side, not CLIENT.

yomama · August 14th, 2002, 12:36 AM

Thanks qball
The reason i mention that there are 3 parts to a page is thats its one of the ways that yahoo stores are set up. Good points though! Do you have any recommendations for server side tweaks?

qball · August 15th, 2002, 12:23 AM

yomama,

dang, yes, I do. Though probably not much help with caching .js files.

Anyway, sometimes server-side processing takes a little time. Most people want , bang, bang, instant responses, else website slow, it sucks.

An example:

[example]
I have a backend DB(MySQL/Access/Oracle/SQLServer/DB2...), that I want users to access thu website. I'm using server-side scripting to query DB and report results. For example, wait, this is an example, very simply, go to URL:

[fake]www.qballlistproducts.com,
no, www.qball.com/listprod.php
[/fake]

Basically list all products I sell and display html to user. I sell a LOT of crap, but we'll get there later.

Now the php script is a mixture of html and php. When a php requests 'hits' web server, will pass request to app/app server, in this case php. php and web server have an active connection until php script completes. Until php script completes, web server wants 'html' to send back to requester.

Got all this? good, me confused, lol.

Knowing this, one can take advantage of how the web server and appserver (in this case, PHP) interact. Every server-side scripting lang has an order of execution, but, let's keep simple...

Ok, almost done. The html a user sees on:

www.qball.com/listprod.php

is just a dropdownlistbox, see below...

Code:

...
<select name=products size=1>
<option value=''>Select a Product</option>
...

with ALL the products I sell. Important, I sell 1500000 products.
ANY db query to return '1500000' rows will take some time(5 sec).

I don't want user to clickey link/paste URL and wait to see webpage display nuffin until db query returns 1500000 products/rows.

What's to do?

code my php script to:

Send all html to web server thus to requesting browser, that is independent of db query, AND not dependent upon db query.

Code:

<html>
<head>
fast loading .js resources, ...
/*be careful, could bog down browser, better yet, no <script></script> tags
*/
</head>
<body>
<p><h1>Welcome to qball's imaginary product selling site!</h1></p>
<form method="POST" name="prod" action="prod_info.asp">
<p<select name=products size=1>
<option value=''>Select a Product</option>

Let's review:
user requests:
www.qball.com/listprod.php
webserver recieves request and passes on to php script
php, processes script and will return the above code snippet to web server (user recieves) BEFORE php connects to db and retrieves list of prods.

Thus user sees webpage with empty ddlb, real quick like.

THEN php, does it's stuff and returns results (formatted in html) and completes rest o' html and rest o' server request. web server happy, interaction complete.

Users been looking at empty ddlb for 5 sec, or, until php processes info form db requested.

Better than looking at nuffin/blank page/clickey STOP button.

User chooses product to buy, sees price, chooses to downlod porn instead!
[/example]

for making this up, how'd I do?

hope it helps and post back with ??s. Maybe I learn something...

CujoRbd · August 25th, 2002, 05:35 AM

You can completely ignore me, but yes. I definitely agree that you need a healthy balance between server-side and client-side processing. If you have a super fast server, then try to make as much as you can on server. In fact, try to do that anyway.
Just however you have it, make it work so that the client gets things the fastest that they possibly can. It'll take some testing to figure out the best mix of everything, but take the time to test it: it will pay off with your visitors/customers.

Good luck with the site! You look like you have all the help you can use.

cryptoguy · August 25th, 2002, 08:53 AM

I personally am against js. scripting because some computers have it disabled and also it usually doesn't work on early Netscape Navigators. If you want your links to change colors and sizes and stuff, try using Cascading Style Sheets (CSS). Otherwise, i don't think js is nessesery

yomama · August 25th, 2002, 02:03 PM

qball, you lost me buddy, way too advanced for me but like i said, im learning. Thanks cujorbd and cryptoguy for your advice as well. So far my pages are just simple html and i think they are loading pretty fast. I try to keep the files as small as possible but the more i build the more ill learn and ill probably be changing the site around in a year or so but thats inevitable. the site is www.air-n-water.com and as you see, not much works so far except the air purifiers link.

Thanks for the help everyone and hopefully in a month or so ill have a functional site. My excuse is that im still working with product distributors so i cant start building until i know exactly what product models i can get from the distributors. bla bla bla. Well, i have a few things set in place so ill start with those. I appreciate any feedback.
thanks

LinuxNewbie · September 1st, 2002, 09:08 AM

an alternative to whatever yer doing is to have php includes on the page. having php includes makes the page a lot easier to deal with because you can split several pages into 1 big template and having several things different. for example, you have 1 basic page but the body of each page is different so you would have the main page be something like index.php then have each include specified as an if statement like this

PHP Code:

  if ($page=='home')

include('home.html')

 
elseif ($page=='buy')

include('buy.html')

it aparently reduces the amount of data sent to the client but it makes more demand on the CPU of the server.