YUI Seed Files – yui.js, yui-base.js and yui-core.js – YUI3 Tutorial

YUI3 has three kind of seed files: yui.js, yui-base.js and yui-core.js. In this you may have used yui.js file always.
(<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>)

I just thought to read about other kind of seed files and its pros and cons. YUI main seed file (YUI.js) includes loader (dynamically load missing modules as per need) whereas yui-base.js does not include loader. First time you call this file (yui-base.js), it will dynamically load loader and other modules metadata. After loader loaded,it will make second request to load desired modules. Therefore, this is good for reducing initial page load time but overall response time of the page will be increased. As many code need to wait for the modules code to load properly.

Yui-core.js file only contain core code and it is not capable of loading any modules required by the YUI code on the page. This is because this does not include Get Utility as yui-base.js. So, every module need to be loaded manually. More about YUI seed files here.

For loading modules manually, you have YUI configurator. Here is configurator for YUI3.

Here is the working code example. It will show you how the code looks with yui-core seed file.

YUI3 Static Loading Example: The code includes everything - HTML and Js. Just copy and paste it on a blank HTML page.


<html>
<head>
<script src="http://yui.yahooapis.com/3.4.1/build/yui-core/yui-core-min.js"></script>
<!-- CSS -->
<!-- JS -->
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/oop/oop-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/features/features-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/dom-core/dom-core-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/dom-base/dom-base-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/selector-native/selector-native-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/selector/selector-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/node-core/node-core-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/event-custom-base/event-custom-base-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/node-base/node-base-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/3.4.1/build/event-base/event-base-min.js"></script>
</head>
http://yuilibrary.com/yui/docs/yui/
<body >
	<div> Parent Div
		<div> Div One </div>
		<div> <strong>Div Two</strong> </div>
		<div> Div Three </div>
	</div>
	<hr/>
	<div id="output">
		</div>
<script>
YUI().use('node', function(Y) {
	//count total divs and print DIVs content (text) here
	Y.all('div').each(function(div, idx) {
		// Output div
		var out = Y.one('#output');
		//Y.log(div.get('innerHTML'));
		out.append(div.get('text') + '<br/>');
	});
});
</script>
</body>
</html>

I saw if I remove any single file for this most basic work, then the code will break. So, I suppose those listed files (modules) are most to have for working with the . This also tells about the most basic of modules required to work in YUI.
For request overhead combo functionality can be used in configurator. I have not used that so that I can see the loaded modules easily.