JavaScript library for dynamically loading CSS and JS files. Also provides the ability to load multiple files from a CDN with multiple fallback options and shimming!
Home Page: http://fallback.io/
License: MIT License
I watched the related network activity of example.html using Chrome inspector.
I was surprised to see that it loads jQuery from the Google CDN twice instead once (not counting the intentional initial failure to a different URL).
The first request returns 200, the next 304 Not Modified.
jQuery-UI is also fetched twice from the same URL instead of once.
This appears to be a bug.
One of the warts of require.js that we have the opportunity to fix here is the misuse of the word "shim" to declare dependencies. Here's the definition of a "shim":
"A washer or thin strip of material used to align parts, make them fit, or reduce wear."
The use in require.js does not resemble "a small piece to makes things fit", it's straight-up a declaration of dependencies. jQuery-UI /depends/ on jQuery already being loaded. So I recommend calling that key 'dependencies' instead of 'shim'.
You could continue to support 'shim' as alternate name, but since this software is relatively young and not even "1.0", I would just opt for changing the name.
In v2. branch, if you load a script like this:
https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=places&callback=some_callback&key=mapping_key
There is a .js appended onto the end of the URL and it ends up loading like this with an "InvalidKeyMapError"
The resulting URL loaded looks like this:
https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=places&callback=some_callback&key=mapping_key.js
The error returned by Google Maps is due to the key "mapping_key.js" not existing. The only workaround is to dump a "&.js" onto the end of the URL to fake an extension.
Is there any way to turn off automatic append of a .js when the script to load doesn't end with a .js ?
Uncaught TypeError: Cannot read property 'length' of null
L202
rules.length sometimes only exists on one object and not the other
L199
var rules = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
Hi,
I'd like to use fallback.js - unfortunately, I do think that most files that I'm referencing do not create a window variable - for example, angular dependencies or jquery plugins:
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-sanitize.js
http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-animate.js
Is there any way to use the fallback with them?
Thanks!
One nice feature of require.js is that it supports "lazy loading"
libraries. That is, it can avoid loading libraries that are not needed.
Here's my own use-case for it, and how I think it might be designed and
implemented here.
We use both jQuery and jQuery-UI on our site, and jQuery UI is large
enough that we would prefer not to load it on pages where we don't need
it.
With the current design, I could address this by creating two small
scripts:
# Set up definition to load jQuery with fall back
load-jquery.js
# Set up definition to load jQuery with fall back
load-jquery-and-jquery-ui.js
I would then load whichever one I needed, and find-and-replace my jQuery
"ready" commands to this instead:
fallback.ready(function() {
// Completed
});
The way I would rather use fallback.js to put all my CDN and fallback
references in one file, and then I would just declare which ones I
needed on a given page, and just those would be loaded.
Here's how that might look:
# My local script which calls fallback.load()
cdn-fallbacks.js
Then, I would replace the jQuery ready() calls depending on which ones I
wanted to load:
# Load everything by default (current behavior)
fallback.ready(function() {
// Completed
});
# explicitly load just jQuery
fallback.ready(['jQuery'],function() {
// Completed
});
# explicitly load just jQuery and jQuery-UI
fallback.ready(['jQuery','jQuery-UI'],function() {
// Completed
});
In the implementation, the call to "this.initialize();" would be moved
from "load()" to "ready()" and would take as argument the optional array
that can now be passed to ready(). If the list has entries in it, only
those elements would be loaded. The call to initialize(); run
immediately when ready() is called (after the callbacks are setup).
require.js supports basically the same feature with the same syntax, and
I assume it's implemented in a similar way.
Without this feature, I could end up with a proliferation of files
related to fallback.js, that each load different combinations of
modules. Or more likely, I might consider switchng to using require.js
rather than deal with the lack of missing feature.
Thanks for your consideration.
Mark
Hi
Using v1 to handle all libraries being loaded you can do this:
fallback.ready(function() {
// All of my libraries have finished loading!
// Execute my code that applies to all of my libraries here!
});
In v2.0.0 there doesn't seem to be a similar way to handle all libraries being loaded, the best I can see is this from the v2 branch readme
// Load All!
req(function(css$bootstrap, jQueryUI, jQuery) {
jQuery("body").append("<h3 class='alert-success'>Loaded All!</h3>");
});
In v2 you need to specify all libraries which means that after adding a new library it needs to be added to argument list for req(), which could be a bit unwieldy if you have many libraries.
Is there a v2 equivalent to fallback.ready without a library specified as in v1?
Thanks
fallback.load({
jQuery: ['//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', 'js/vendor/jquery.js']
//...
});
fallback.ready(['jQuery'], function() {
fallback.ready(function() {
console.log("ready");
});
});
Produces stack overflow in chrome. Was going to create a promise indicating all scripts have loaded.
I have been running through your examples for version 2 of the library, but I unable to get the css detection to work properly. The CSS cdns are called and are loaded on the page; but the library test fails to recognize it has been loaded. I have tried using the provided example by making the export a known class of the library (quite frankly not exactly sure how that logic was meant to work), and I have some custom check functions, but do seem to work as the browser doesn't update the document styles until after the library completes it cycle. Any ideas...
Hi,
Shouldn't fallback only inject one of the urls options defined for a specific library? I'm trying to load bootstrap with urls pointing to cdn and one hosted on my server but when I inspect the page, it's injecting both of the urls. Is that the correct behavior?
cfg({
// The list of libraries that we want use for our project.
'libs': {
// Include Twitter Bootstrap.
// We explicity prefix css$ to the beginning of our key so Fallback JS
// knows to load this library as a Cascading Stylesheet (CSS).
'css$bootstrap': {
// Fallback JS will check to see if this style currently exists on the
// page. If it does exist, the library will not attempt to load the file
// as it will assume it's already been loaded on the page.
'exports': '.col-xs-12',
// The URLs to load Twitter Bootstrap.
'urls': [
'//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min',
'/vendor/bootstrap/dist/js/bootstrap.min.js'
]
},
// Include `jQuery`.
'jQuery': {
'alias': ['jQuery', '$', 'jq'],
// The URLs to load `jQuery`.
'urls': [
'//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js',
'/vendor/jquery/dist/jquery.min.js'
]
},
'bootstrap': {
'exports': 'bootstrap',
// Load `jQuery` first before loading this library.
'deps': 'jQuery',
'urls': [
'//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js',
'/vendor/bootstrap/dist/js/bootstrap.min.js'
]
},
'materials': {
'exports': 'materials',
'deps': 'bootstrap',
'urls': [
'//cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.1.6/js/material.min.js',
'/vendor/bootstrap-material-design/dist/js/material.min.js'
]
},
'ripples': {
'exports': 'ripples',
'deps': 'materials',
'urls': '/vendor/bootstrap-material-design/dist/js/ripples.min.js'
}
}
});
The project does not declare the software licensing terms, but should.
Hi,
I am trying to load different js libs from CDN, out of which jQuery and Angular are loading up fine but others including underscore, moment, highcharts, highcharts-ng are just not loading up. Here is what I have :
fallback.load({
jQuery: [
'//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.FAIL_ON_PURPOSE.min.js',
'//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js'
],
angular: [
'//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js'
],
//highcharts: [
// '//code.highcharts.com/highcharts.js'
//],
//'highcharts-ng': [
// '//rawgit.com/pablojim/highcharts-ng/master/dist/highcharts-ng.js'
//],
underscore: [
'//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js'
]//,
//moment: [
// '//cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.3/moment.js'
//],
//'loading-bar': [
// '//cdnjs.cloudflare.com/ajax/libs/angular-loading-bar/0.7.1/loading-bar.min.js'
//],
}, {
// Shim different libs so that it will only load after jQuery has completed!
shim: {
//'underscore' : ['jQuery']
//'highcharts': ['jQuery'],
//'highcharts-ng': ['angular'],
//'loading-bar': ['angular']
},
callback: function (success, failed) {
// success - object containing all libraries that loaded successfully.
// failed - object containing all libraries that failed to load.
console.debug('those which loaded');
console.debug(success);
console.debug('those which failed');
console.debug(failed);
alert('Success');
// All of my libraries have finished loading!
// Execute my code that applies to all of my libraries here!
}
});
fallback.ready(function () {
// All of my libraries have finished loading!
console.debug($);
console.debug(angular);
console.debug(underscore);
// Execute my code that applies to all of my libraries here!
});
In fallback.ready, underscore stays as undefined, while jQuery and Angular does show version detail. Any help?
Loading a CSS file like this causes the resource to be loaded as a script, as it doesn't end in ".css"
fallback.load({
roboto_slab_css : [ '//fonts.googleapis.com/css?family=Roboto+Slab' ],
//etcThe workaround is something like this:
fallback.load({
roboto_slab_css : [ '//fonts.googleapis.com/css?family=Roboto+Slab&.css' ],
//etcThis is a great little library!
Could you please add a package.json (for meta data) and register this project with bower.io. You will also need to implement semver http://semver.org/ ( git tag v0.0.1; git push )
This will make it easier for developers to consume fallback and keep it up to date.
Hi,
I have having problem with android browser. In this old browser link element can't use onload property https://pie.gd/test/script-link-events/
A made some simple script for fast fix which detect only android browser and in interval 5s tries to detect loaded styles
(using version v1)
var userAgent = navigator.userAgent;
var iChromeBrowser = /CriOS|Chrome/.test(userAgent);
var isAndroidBrowser = /Mozilla\/5.0/.test(userAgent) && /Android/.test(userAgent) && /AppleWebKit/.test(userAgent) && !iChromeBrowser;
if (isAndroidBrowser) {
var count = 0;
var interval = setInterval(function() {
if (me.css.check(library)) {
clearInterval(interval);
return me.spawn.success(payload);
} else if (count >= 10) {
clearInterval(interval);
return me.spawn.failed(payload);
}
count++;
}, 500);
}
Hello,
I notice that fallback keep on requesting from original source all the time and is not loading any files from cache. Meaning that, every time a page is refresh a new request is being made to reload ALL of the files and this will definitely slows down the page loading time.
Is there any way to tell FALLBACK that if file is already exist in the cache, just use that one. Or to make it browser friendly, in a way browser would load from cache when FALLBACK is requesting for a certain file.
Thank you.
No problems with v1.1.6 in Chrome, Firefox or Internet Explorer 10 (emulation mode).
Issue is specific to v1.1.6 in Internet Explorer 11.
This issue does NOT exhibit itself with v1.1.5.
Here's the jsFiddle: https://jsfiddle.net/cormip/hsu22aen/
Just sent a pull request, and sorry ahead of time for not being able to lint, but came up with the following error when i tried:
C:\redacted\Git-Hub\Brad-Christie\fallback>grunt lint --debug
Running "eslint:js" (eslint) task
[D] Task source: C:\redacted\GitHub\Brad-Christie\fallback\node_modules\grunt-eslint\tasks\eslint.js
Warning: Definition for rule 'space-unary-word-ops' was not found. Use --force to continue.
Aborted due to warnings.
Already npm install -ed & bower install -ed, but still not working. Am i missing something? Also, I assume I'm not the sole "breaker of the build" on travis given it appears to have a history of failing on previous commits.
Anyways, if I've missed something please let me know. I think the project has a lot of potential (esp given the asset loading over just javascript), and would like to help when possible but don't want to be that guy that can't follow a contrib guideline. ;-)
Thoughts? Irate Comments?
I have some questions as how to configure fallback:
Here are the JS scripts and the inline javascripts I need to load on my site:
http://plnkr.co/edit/ydIrf1SjwnPz1xVSBjou?p=catalogue
I put all my scripts on index.html code and the configuration of fallback on fallback.conf.js (I included questions here too).
Thank you!
Alex
I noticed that the config below (for v1.7) causes bootstrap.min.js to be requestes from both CDNs. Not sure if I'm making a mistake or not?
jquery.min.js 200 ajax.googleapis.com script fallback.min.js:8 29.3 KB 58 ms
bootstrap.min.js 200 cdnjs.cloudflare.com script fallback.min.js:8 10.0 KB 67 ms
bootstrap.min.js 200 maxcdn.bootstrapcdn.com script fallback.min.js:8 12.0 KB 321 ms
fallback.load(
{
'jQuery': [
'//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js',
'//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js'
],
'bootstrap': [
'//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js',
'//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js',
],
},
{
shim: {
'bootstrap': ['jQuery']
}
}
);
When I try to run the demo with the index.js file I get the following error message on the web console:
Uncaught TypeError: fallback.importer is not a function(anonymous function)
Does fallback.js support adding conditional commenting for Internet explorer?
I'm using fallback.js v1.1.7. The code I put in the head of this is:
<script>
fallback.load({
materializecss: [
'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css',
'{{ site.baseurl }}/css/materialize.css'
],
jQuery: [
'https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js',
'{{ site.baseurl }}/js/jquery-2.2.0.min.js'
],
materializejs: [
'https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js',
'{{ site.baseurl }}/js/materialize.min.js'
]
}, {
shim: {
materializejs: ['jQuery']
}
});
</script>And in both Safari and Chrome (on Mac), materialize.min.js is loaded twice, once for both instances (local and CDN).
I don't know if it is a user error or a bug. I tried to follow the examples given. And I can't see why the cases between materialize.min.js and materialize.min.css are different. The only difference is the shim but if I remove it, materialize.min.js will still loaded twice.
I would be great if the README file could be updated to document what browsers this JavaScript has been tested to have support for.
When I create the following code:
"goodurl.js"
"badurl.js"
"goodurl.js"
It should load only the first url but I also get a 404 error of the second url who fails. Why is that? I would like to have just 1 request, not 2. When the first request is good it should not render the other fallbacks.
I am trying to include Bootstrap using Fallback.js from CDN with local server fallback like this:
fallback.config({
libs: {
"css$bootstrap": {
exports: ".col-xs-12",
urls: [
"//maxcdn.bootstrapcdn.com/bootswatch/3.3.6/paper/bootstrap.min",
"lib/bootstrap.min"
]
}
}
});
fallback.require("css$bootstrap")This causes glypthicons font files to be loaded from local server (it seems like this happens because Fallback.js loads files using AJAX and bootstrap CSS contains a relative path for glypthicons font files - is that correct?).
How can this can be fixed?
could you provide an example of how to handle a load where a is_defined would not work like it does for jQuery but how one would go about working around that. Some examples are bootstrap.js modernizr.js knockout.js
I'm only seeing this problem in Internet Explorer 11. (Haven't tested IE9 or IE10.)
Using fallback.js version 1.1.1, error occurs on Line 208:
if (stylesheet.rules) {
in function fallback.css.check()
Test page exhibiting the problem (IE11) is here:
The following code loads BOTH css files instead of just the first that successfully loads
'normalize': [
'https://cdnjs.cloudflare.com/ajax/libs/normalize/2.1.3/normalize.min.css',
'css/third-party/normalize-2.1.3.min.css'
]
If it helps i've included a screenshot of the chrome devtools network panel
As you can see both files are loaded
If this was the intended behavior then how would I go about doing this myself?
Hi,
I’m getting the following error in IE8:
'shim' is null or not an object (fallback.js, line 142, character 4)
The line is question is:
if (!me.is_object(options.shim)) {Any idea how to fix this?
Thanks,
Dylan
The problem is specifically with the fallback.ready() function when the [libraries] array is NOT passed.
fallback.ready(function() {
// All of my libraries have finished loading!
// IE10 will execute this code before all libraries have been loaded
// Execute my code that applies to all of my libraries here!
});
Works as expected in IE11, FF & Chrome. Problem was tested in both a real IE10 install as well as using IE11 Debugger with IE10 emulation enabled.
Sal,
We are still testing the script with version 2. We get everything working except that we experience a significant delay loading the CSS. You can visit http://costarica.com/test/home-page.html. Could you tell us what we are doing wrong?
Thanks,
Alex
I'm looking to get feedback on the v2 draft.
-- UPDATED --
Track specification and progress via: https://github.com/dolox/fallback/tree/v2
Everyone I tagged here either submitted a bug in the past or was involved somehow in the project.
I would love to hear your feedback on this.
Goals:
fallback.require you would write req. Instead of fallback.config, simply use conf.Example:
fallback.config({
urls: {
'img!logo': [
'//www.amazoncdn.com/logo.png',
'//www.amazoncdn.com/logo2.png'
],
'css!bootstrap': [
'//www.bootstrapcdn.com/bootstrap', // .css will automatically be suffixed by the library
'//www.amazoncdn.com/bootstrap'
]
}
};
fallback.config({
urls: {
'img:logo': [
'//www.amazoncdn.com/logo.png',
'//www.amazoncdn.com/logo2.png'
]
}
};
fallback.config({
urls: {
'img$logo': [
'//www.amazoncdn.com/logo.png',
'//www.amazoncdn.com/logo2.png'
]
}
};Instead of css!bootstrap, maybe possible using:instead. So:css:bootstrap`.
fallback install angular, and when I go ahead and do that, the CLI would use bower for the install, but then automatically append the library that bower just installed to your Fallback config file so we (the users) don't have to go digging and hand typing our paths. Full automation. You type in the CLI, it automatically adds to your config, your done.window.jQuery would still work, whereas with RequireJS it won't. I was using RequireJS with a project, and I wound up wasting hours trying to fix the project to work right with concatenating and minifying files with their r.js library, because I had no choice but to use their r.js library. I did a lot of googling on that matter, I know I'm not alone in that complicated mess of confusion.Looks like when I specify jQuery with "//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" it doesn't load it and goes to the local "jquery.test.min.js" that gives me message that it's loaded because I put some console.log in "jquery.text.min.js". But if add "http:", like "http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" it loads the first one. Is there a way to make it work without adding "http:" or can you please show where is my mistake?
This is an example I'm testing fallback.js.
<html>
<head>
<script type="text/javascript" src="https://raw.githubusercontent.com/dolox/fallback/v1.1.7/fallback.min.js"></script>
</head>
<body>
<script>
fallback.load({
jQuery: [
'//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js',
'jquery.test.min.js',
],
})
</script>
</body>
</html>This one does load it from cdn.
fallback.load({
jQuery: [
'http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js',
'jquery.test.min.js',
],
})Tried it in Firefox 42.0
Thank you & best regards,
Artem
Delete this one too. I was not using the proper window keys.
fallback.js provides's it's own ready() method, as does jQuery.
Some documentation would be helpful to clarify how they expected to be used together. Do you call Jquery's ready() method from within the fallback ready() method? Vice-versa? Or is one used instead of the other?
Some simple docs and an example would be helpful.
This is the charters code:
<script type="text/javascript">var switchTo5x=true;</script> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript">stLight.options({publisher: "xxxx", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>What I did was:
"shareThis": '//w.sharethis.com/button/buttons.js'
and then on a call ready function I do:
fallback.ready(['shareThis'], function() {
// jQuery Finished Loading
// Execute my jQuery dependent code here!
__st_loadLate=true;
stLight.options({publisher: "xxx", doNotHash: false, doNotCopy: false, hashAddressBar: false});
});
When I get charters uploaded I get an error that it does not find the publisher key. Any ideas how to fix this?
If you register with bower, folks using Yeoman / Yo ( http://yeoman.io ) and Bower ( http://bower.io ) will have an easier time including your package in their client side requirements.
Hi, just asking... like your project... why is there no support for bower package manager... ( I know, we have become that lazy today :D )
After playing around with RequireJS, LABJs and others, I am really happy that I've found this one now. It looks quite simple and straightforward. I must admit that I am not a JS guru, so I have a question.
I'd like to use fallback.js from within a PHP class that generates forms. The class does not "know" anything about the page where the form is included, so it does not know which JS (and CSS) will be already loaded when it comes to the form. But it will attach several JavaScripts and CSS to special form fields. (Like a datepicker to date fields.)
So in fact I don't only need a fallback, I also need a "fallback but only if it's not already there". (Especially for jQuery and jQuery UI.)
Can this be achieved with this JS? Maybe something like (pseudo code):
if(typeof jQuery == 'undefined') { // add jQuery library to fallback.load() }
This will work just fine until it comes to
fallback.ready( 'jQuery' )
I think if fallback.js did not load the lib that key will be false forever?
on the website http://fallback.io/ the last selling point is:
INCREASE PAGE LOAD TIMES
BY AN AVERAGE OF 35%!
maybe it should be
boost page load times
or
increase page load speed
Not a big deal, but what the hell...it'll be my "contribution" to this project :)
Typo in the example of main.js: "vaiable" --> "variable"
According to the documentation, the basic structure for a fallback.load call is:
fallback.load({
// css/js key/value(s) pairs
}, {
'shim' : function() {
// dependency definitions here
},
'callback' : function() {
// stuff here
}
});I've just downloaded the most recent copy of the library and the callback wasn't firing for me. So, I wandered through the other code in the repository, and within demo/build/index.js I found that instead of using the above structure, one of the load calls in the example had the following structure:
fallback.load({
// css/js key/value(s) pairs
}, function() {
// stuff here
});When I used this structure for the load call, the callback fired correctly. I found that it would also fire correctly if I used the following structure for the load call:
fallback.load({
css/js key/value(s) pairs
}, {
'shim' : function() {
// dependency definitions here
},
}, function() {
// stuff here
});I was curious if this was the expected behavior and the documentation was just out of date, or if perhaps I had done something wrong. Using this latter structure for the load call, everything seems to be working fine for me so far.
Thanks for writing this package, by the way. I think it's great.
Hello,
in the version 1.0.0 recently released the .ready(function) method is never called and this make the library unusable.
I bisect the problem down to the 5f39d66 commit.
I'm actually using version dafd206 where the .ready(['lib'], function) is not working but the final .ready(function) is working.
delete this issue .. it was a shim issue.
Also, one last piece. Not that I haven't already been annoying enough with all of my issue updates here... :) I only mention this here because it took me a while to figure out what you were talking about when you mention "shimming".
Like your reference in the fallback.js documentation to the word's definition states, a "shim" is essentially "a small piece of something that allows a much larger something to work appropriately". A great example of this is the html5 shim for versions of IE prior to 9. This shim can be used by including
<script type='text/javascript' src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
in the html of a page. It allows html5 elements to work better on legacy IE browsers. Thus, it's a small piece (file) that allows a larger something (html5) to work appropriately.
The "shims" that you are defining are really "dependencies". One file (js or css) is dependent upon, or must be loaded before, another file.
"INCREASE PERFROMANCE, KEEP YOUR SITE WORKING!"
When I do
script src="/fallback.min.js"></script>
script>
My Script Block
/script>
It blocks resources of the page.
If I set it up asynchronously script src="/fallback.min.js" async></script>, then I get an error stating that function fallback Uncaught ReferenceError: fallback is not defined.
How am I supposed to set this up so that the fallback.min.js downloads asynchronously and I do not get an uncaught reference error?
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.