Javascript question

[robert_gsfame]

I just wanna ask, i have used lots of javascript function in one of my page and i found the size of it is over 1 MB, i dont have any idea on how to reduce the size of it as all code is necessary.....how long will it take to open this huge size of page.

 

Thx

[Adam]

1MB of JavaScript, are you kidding?

 

If not, you can "minify" it and gzip it.

[Ken2k7]

OMG! Are you serious!? If so, I'm pretty sure 95% of it is redundant and you can abstract it. That is some serious coding. I applaud you for your persistence in actually typing all of it.

[robert_gsfame]

how can i minify the script????

[Ken2k7]

Google a JavaScript minifier. JSMin is a good one. But seriously, you really have a JavaScript file that's over 1MB big? I suggest trimming down the coding and making the file smaller.

 

You can also gzip it. That makes it a bit smaller.

[robert_gsfame]

It's impossible to remove any part of the code as everything is necessary.

I put the javascript inside my php page, can i also GZIP it?? i am really new to GZIP

[Ken2k7]

Not really remove, but re-write. I'm sure there are some repetitions in your code right?

[KevinM1]

Yeah, a 1MB JavaScript file just screams that it's in need of refactoring.  Stick to DRY - Don't Repeat Yourself.  If you find yourself repeating entire sections of code, put it in a function.

 

It's impossible to remove any part of the code as everything is necessary.

I put the javascript inside my php page

 

Ah, that's not really the best design decision (as you're currently learning the hard way).  Ideally, your markup should be separate from your PHP, and include/require-ed in with the bare minimum of code needed to pass in processed values for display.  JavaScript library code should also be put into external files.  Your critical JS - the stuff that actually manipulates page items - should be as small and concise as possible.  Again, DRY.

 

Also, are you coding your JS in an unobtrusive manner (i.e., not sticking a bunch of repeated JS in HTML tags)?  That can save a lot of repetition, and is really the way to go.  It also facilitates Separation of Concerns, making it easier for one to modify, edit, and debug their code.

[robert_gsfame]

i think so...its like this  there are 3 combobox the first combobox is country where i can write it without using any javascript <option>America</option><option>Belgium</option> and each country will fill the second combobox so if i choose america n all cities in america will appear in my second combobox and finally the second will affect the third one which is the area code....

 

So can u give me some example on how to write those efficiently??

[Ken2k7]

Wait, you hard-coded all the cities of America in a JavaScript file!? How many do you have? If it's more than say 30 (and that's already pushing it), I would put them in a database and use AJAX to fetch them.

[robert_gsfame]

how can i retrieve the data from database n put those directly to the second combobox using javascript....don't have any idea on how to do it..

i really wish to use Javascript as page doesnt need to reload

 

so let say i have this in database

country    city

America    Chicago;Texas;Las Vegas

 

n i choose America from first combobox, how can i retrieve all cities from database without reloading the page??using javascript..

 

 

[Ken2k7]

Please read! I said AJAX.

[robert_gsfame]

gosh...i dont have any knowledge about AJAX

[KevinM1]

Like Ken said, you'd have to use AJAX.

 

I'm getting the feeling that you're shooting blind here.  That you're not entirely comfortable with JavaScript, and are essentially throwing code against the wall to see what sticks.  I was there myself not too long ago.  Unfortunately, that's not the most effective way to code.

 

My advice is to get a good JavaScript book.  I find John Resig's book to be the best: Pro JavaScript Techniques.

 

Also, if that's what your DB tables actually look like, you should probably spend some time with database design as well.  Cities should be in their own table, with their home country's id as a field to link them, like so:

 

Countries table -
id                    name
1                     America
2                     Albania
3                     Argentina
.
.
.

----------------------------------------

Cities table
id                   country_id                    name
.
.
.
22                  1                                  Baltimore
23                  1                                  Boston