For a website with live "edit-in-place", first I get the jQuery library from the fastest CDN for free ...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
... and on top of that I need the Jeditable plugin, listed in the jQuery repository at jQuery on this page!
Is this plugin also hosted on Jquery CDN?
If not, whats the use of jQuery having a plugin in the repository without hosting the script?
In other words whats the use of a plugin repository?
How to load a script directly from jQuery repository?
<script src="................................../jeditable.js"></script>
http://www.appelsiini.net/projects/jeditable
http://www.appelsiini.net/projects/jeditable/default.html
https://github.com/tuupola/jquery_jeditable
I'm mostly using cdnjs for common js things.
A search for jeditable.js gives you the link and the script tag for easy copy-pastin'.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jeditable.js/1.7.3/jeditable.min.js"></script>
Plugins are most likely not hosted on jquery CDN, because they are most likely not written by the people behind jquery.
Discoverability? Don't know how their plugin listing works, but may have been from users submitting their plugins for example. Actually hosting the plugins would add another level of unnecessary complexity. Especially if the goal is discoverability, i.e. an easy place for jquery new-comers to see what else might be possible.
I don't know how "cloudflare one day hosts something and otherday it doesnt work without notice". At least not with cdnjs, which has always worked for me. But if you're worried, just download the script and host it yourself instead...
Related
I am using Bootstrap, but would like to reduce the size of the Javascript.
I only need dropdown/collapse and sometimes carousel, so I want to include only those.
There is a folder "dist" with every single script individually.
I tried including them via -SCRIPT- tag. It does not work at all and produces lots of errors in the console.
Do I need specific other script files too, or is the JS in the dist-folder just not suitable for that?
Please forgive me, I have very little knowledge about JS and english is not my first language.
Simply put, how do I include only the needed JS into Bootstrap5?
I am on Windows and do NOT have NPM or any other bundler/packager/installer.
I am surprised, there is no dedicated website for configuring the JS.
I googled a lot but did not find anything related to my question.
First call basic utilities then call individual components [bootstrap 5.2.3]
My first observation is that you may be heading down the premature optimisation path. The difference between the minimal bootstrap build, and the individual components isn't huge. And on top of this, the main advantage of using a CDN is that the browser will likely have already loaded and cached it (from use in another site: it's a common resource) so trying to do anything non-standard will increase load-times, not reduce them.
But if you're set on using the individual components, they are available on the CDN too, as described on the bootstrap site.
Make sure to use the integrity and crossorigin attributes to protect your site from leaking information to the CDN, and also being attacked via the CDN. If you're new to this, have a read of this page on subresource integrity.
Use Bootstrap Cdn
You can simply use this link
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.1.3/dist/js/bootstrap.bundle.min.js"></script>
Now u dont need to include from folder
I'm theming Bootstrap with custom styles, by using a local copy of the source SASS files as described on the official documentation, and importing them in a custom.scss file.
I'm mainly willing to customize the appearance, non the functionality; so, in example: colors, typography and the so-called "Sass options".
In this kind of scenario, are there any downsides or possible problems in importing the JS part of Bootstrap (I'm referring in particular to bootstrap.bundle.min.js) in my project by using a CDN instead of providing it from local?
EDIT: Please note that I'm not asking how loading a resource from CDN is different from loading it from local, I'm just asking if loading a part of Boostrap from CDN and another from local could lead to problems or unexpected behavior.
This is probably a silly question, I'm reasonably sure that I can do this without incurring in any problem, but I'd like to have some feedback from someone more expert than me.
If you can, you should host the JS yourself.
Since bootstrap uses integrity parameters in their example "how to use" code, you don't really have to be scared about cross site scripting attacks if their CDN is compromised (unless you leave them out in your code). The files will simply not be loaded.
That is still however not something you want: If their CDN is compromised or their servers simply crash, you will not be able to load the JS anymore and parts of your app might become unusable.
You could, however, first attempt to serve from the cdn and if that's not possible give the user a local version. That way you can utilize the cache and be save when bootstrap servers go down. Here's a small excerpt taken from freecodecamp:
<script>
if (! $.fn.modal) {
document.write('<script src="YOUR JS LOCATION"></script>');
}
</script>
You should put this underneath the line where you include the bootstrap CDN.
The code simply checks if a function from bootstrap is available and if not loads it from your local server.
I have noticed that the bootstrap provides a jQuery link that you can use to run the JavaScript files. What I would like to know is if it matters what jQuery link you use.
Currently, the code provided by the bootstrap site is:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
Would it hurt if I used these links below to replace the above link:
<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
It will not create any issue as jQuery library version is same. as per your link both files version is same that means files is same but loads from different server.
Main thing is you need to use jQuery library suggested by bootstrap
jQuery (necessary for Bootstrap's JavaScript plugins) .
you can download that files to your local project folder and use in project it will work fine.
jQuery Migrate Plugin
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
jQuery Migrate Plugin simplify the transition from older versions of
jQuery. The plugin restores deprecated features and behaviors so that
older code will still run properly on jQuery 1.9 and later.
These two file are exactly the same therefore you should not see any difference.
No. It will be not. Because the links which you have mentioned will have the same jquery files and those links are nothing but different CDNs that deliver webpages and other Web content to a user based on the geographic locations of the user, the origin of the webpage and a content delivery server.
As per the mentioned link this service is effective in speeding the delivery of content of websites with high traffic and websites that have global reach. The closer the CDN server is to the user geographically, the faster the content will be delivered to the user.
I am working ot his project:
www.eltotaldesign.com/planeteco
I have the modules dj image slider, and another named altra switcher.
I tried to install Easy Jquery, and other methods, but nothing helps.
It's 100% problem with jquery and mootols conflict, but I cannot resolve it.
It's there any scripts to resolve this ?
Thanks!
To solve those compatibility issues you can try:
Always load Mootools before Jquery
Always load and use Jquery noconflict
Make sure you load those libraries just once per page
Don't load any of them if you aren't going to use it
Be careful with joomla cache and when combining js files
Use carefully any extension that gives you some control on js libraries:
http://extensions.joomla.org/extensions/site-management/site-performance
http://www.joomlabamboo.com/joomla-extensions/jb-library-plugin-a-free-joomla-jquery-plugin
Do you need mootools on the front end of your joomla install?
If not remove it! It will save your visitor from having to load two libs to view your site:
http://magazine.joomla.org/issues/Issue-Feb-2011/item/349-removing-mootools
If you require both make sure any mootools is using the preferred document.id instead of $ as well as setting jquery in noConflict mode.
Hope this helps! Post back the results.
When you need to use more than one javascript library for extended functionality. Two most popular libraries are mootools and jquery. They conflict because mootools is a prototype and jquery is not. But there is a simple technique to fix this. you can use them both without a conflict.
You just need to take 2 precautions.
Add jquery in no conflict mode. It ensures that more than one jquery library can be used simultaneously.
jQuery.noConflict();
Include all your jquery code as below
(function($){
//jquery code goes here.
})(jQuery);
See the complete code.
//no conflict jquery
jQuery.noConflict();
(function($) {
//jquery code goes here.
})(jQuery);
I'm currently linking to jquery from Google. This way I'm not hosting the file on my server.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
Anyone knows of a similar service that's available for the individual jquery plugins?
There isn't one out there yet (though some sparse plugins have their own CDN, like jQuery Tools).
However, the jQuery team is working on this with Media Temple (which currently hosts jquery.com and other related sites)...I'm not sure how far along it is though.