Skip to content

Instantly share code, notes, and snippets.

@caridy
Created October 29, 2010 19:44
Show Gist options
  • Save caridy/654256 to your computer and use it in GitHub Desktop.
Save caridy/654256 to your computer and use it in GitHub Desktop.
loading-strategy
YUI().use('tabview', function(Y) {
var config = Y.config.app || {};
if (config.tabview) {
new Y.TabView({
srcNode: config.tabview
});
}
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>loader limitations</title>
</head>
<body class="yui3-skin-sam">
<p> ~20k of HTML content in here... </p>
<script src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>
<script src="http://yui.yahooapis.com/1.0/build/app.js"></script>
<script>
YUI().use('tabview', function(Y) {
var tabview = new Y.TabView({ srcNode: '#demo' });
});
YUI().use('slider', function(Y) {
var slider = new Y.Slider({ value : 50 });
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>loading strategy</title>
</head>
<body class="yui-skin-sam">
<p> ~20k of HTML content in here... </p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>loading strategy</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/
2.4.0/build/reset/reset.css">
<link rel="stylesheet" type="text/css" href='app.css'>
</head>
<body class="yui-skin-sam">
<p> ~20k of HTML content in here... </p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>fast page</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/
2.4.0/build/reset/reset.css">
<link rel="stylesheet" type="text/css" href='http://yui.yahooapis.com/
2.4.0//build/tabview/assets/skins/sam/tabview.css'>
<link rel="stylesheet" type="text/css" href='app.css'>
<script src="http://yui.yahooapis.com/
2.4.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script src="http://yui.yahooapis.com/
2.4.0/build/tabview/tabview-min.js"></script>
<script>
var myTabs = new YAHOO.widget.TabView("demo");
</script>
</head>
<body class="yui-skin-sam">
<p> ~20k of HTML content in here... </p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>fast page</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?
2.7.0/build/reset/reset.css&
2.7.0/build/tabview/assets/skins/sam/tabview.css">
<link rel="stylesheet" type="text/css" href='http://company.cdn.com/app.css'>
</head>
<body class="yui-skin-sam">
<p> ~20k of HTML content in here... </p>
<script src="http://yui.yahooapis.com/combo?
2.7.0/build/yahoo-dom-event/yahoo-dom-event.js&
2.7.0/build/element/element-min.js&
2.7.0/build/tabview/tabview-min.js"></script>
<script src="http://company.cdn.com/app.js"></script>
<script>
var myTabs = new YAHOO.MyCustomTabView("demo", { /* custom config */ });
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>fast page</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/combo?
3.2.0/build/cssfonts/fonts-min.css">
<link rel="stylesheet" type="text/css" href='http://company.cdn.com/
1.0/build/app.css'>
</head>
<body class="yui3-skin-sam">
<p> ~20k of HTML content in here... </p>
<script src="http://yui.yahooapis.com/3.2.0/build/yui/yui-min.js"></script>
<script>
YUI().use('tabview', function(Y) {
var tabview = new Y.TabView({ srcNode: '#demo' /*more*/ });
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>fast page</title>
<link rel="stylesheet" type="text/css" href='http://company.cdn.com/combo?
3.2.0/build/cssfonts/fonts-min.css&
3.2.0/build/tabview/assets/skins/sam/tabview.css&
3.2.0/build/widget/assets/skins/sam/widget.css&
1.0/build/app/app-min.css'>
</head>
<body class="yui3-skin-sam">
<p> ~20k of HTML content in here... </p>
<script>YUI_config = { app: {tabview: '#demo'} };</script>
<script src="http://company.cdn.com/combo?
3.2.0/build/yui/yui-min.js&
3.2.0/build/loader/loader-min.js&
3.2.0/build/tabview/tabview-min.js& /* plus other dependencies */
1.0/build/app.js&
1.0/build/init.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>fast page</title>
<link rel="stylesheet" type="text/css" href='http://company.cdn.com/combo?
1.1/rollout/app.css'>
</head>
<body class="yui3-skin-sam">
<p> ~20k of HTML content in here... </p>
<script>YUI_config = { app: {tabview: '#demo'} };</script>
<script src="http://company.cdn.com/combo?
1.1/rollout/app.js"></script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>fast page</title>
<link rel="stylesheet" type="text/css" href='http://company.cdn.com/combo?
1.2/rollout/app.css'>
</head>
<body class="yui3-skin-sam">
<script>
/* a tiny piece of inline javascript magic to implement
event binder + preload + iframe injection + bootstrap */
</script>
<p> ~20k of HTML content in here... </p>
<script>YUI_config = { app: {tabview: '#demo'} };</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment