I don't want my users having to load a ton of JS files if their browser doesn't support it. What's the best/easiest/fastest to only load JS scripts if the browser supports Javascript?
Thanks in advance,
- JS noob
If JavaScript is off, the browser won't download files from the src attribute of <script type='text/javascript'> tags.
Related
Can things like <script type="text/javascript" src="/actions/generateScript"></script> be used without troubles?
It's kinda hard and tricky to setup server for processing urls with extensions, so maybe I just don't need them.
No, it's not needed. Browser just tries to download resource from src and execute it as JS code.
I once have use .php file as CSS source and it worked fine
No, since you already have "script type="text/javascript" the browser knows you are attempting to load a .js file. In addition modern browsers will run javascript regardless.
I load Google's maps API js files. They are loaded at the end of the page. Besides, I want to load a js file that are using Google's js files. What I want to do is to load this js file after Google's files are loaded. How can I do that?
<script src="https://maps.gstatic.com/maps-api-v3/api/js/19/7a/main.js"></script>
This is the main.js file. I want to load another file just after this js. How can I do that?
Scripts are, by default, executed sequentially, so if you do:
<script src="https://maps.googleapis.com/maps/api/js?key=..."></script>
<script src="myscript.js"></script>
then "myscript.js" will be loaded after Google Maps script has been loaded. See this answer for some more detail.
For simple use cases, this will be enough. If you want to have a bit more control and/or your app is large, take a look at RequireJS.
Requirejs should solve your problem. Every time you need a certain dependency, you would call require('dependency'); and requirejs should fetch it, if it hasn't been downloaded already.
I have ASP.NET (4.0) web site which in turn has some JavaScript on it. As time goes I include more and more JS files into my aspx and ascx files. Usually I just add
<script type="text/javascript" src="/js/script1.js"></script>
That works fine for small add-ons, but in some cases script1 references to script2 and I need to add one more reference IN EACH PLACE where script1 is used.
Is that the proper way to include JS files? Or I would better load script2.js from script1.js (How do I include a JavaScript file in another JavaScript file?) that will guarantee it will be always included?
Could you please recommend references on the "best practice" with regards to this topic. I've googled for some, but found way too many links and really sank...
Thank you for your help!
The best way I can think of is to base your forms on a MasterPage and then reference all of your js file in the head section of your MasterPage.
so id like to link a refernce to a couple js files if possible, but im not sure i could go about doing this so i can use it
<script type=text/javascript src=http://mylinkedjs></script>
and call i from my jquery.
Anyone know how this is possible?
Let me try to rephrase your question.
I want to include some JavaScript files from another server on my page, and call functions from those files in my own jQuery code. Is this possible?
That’s certainly possible. Once you’ve included a JavaScript file on your web page (like you did in the question), the global variables it creates are accessible to any other JavaScript running on that page, regardless of which server the JavaScript file was loaded from.
This is often how jQuery itself is included on pages: by linking to a copy of jQuery on a big CDN, e.g.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
See http://docs.jquery.com/Downloading_jQuery#CDN_Hosted_jQuery
<script type="text/javascript" src="http://wherever.com/linked.js">
I've recently moved a site over to use the Google AJAX Libraries instead of hosting the library js files myself. At the moment I'm using the Google recommended approach:
<script type="text/javascript" src="http://www.google.com/jsapi?key=MYAPIKEY"></script>
<script type="text/javascript">google.load('jquery', '1.3.2');</script>
But it seems a little silly to me to include an extra JavaScript file, just so I can call another script file.
My question is, is there actually any advantage to calling these files via google.load() as opposed to simply including them via script tag like so:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
My main reasons for using the Google hosted libraries are the speed of their CDN/edge caching systems; am I still getting those benefits if I link directly to the file?
the main advantage for using the loader api is that you will prevent blocking by the browser when its doing the initial downloads. Browsers can only download between 2 & 10 things at a time so if there is blocking it will give bad user experience
Steve Souders and the Yahoo! Exceptional Performance team have done a lot of research into this to get faster websites. Nick Zakas (JavaScript guru) blogged about using Steve's ideas here