YUI Library: YUI PHP Loader Utility
Yahoo! UI Library: YUI PHP Loader
The YUI PHP Loader Utility is a server-side utility that allows you to load specific YUI components and their dependencies into your page via PHP. YUI PHP Loader can operate as a holistic solution by loading all of your necessary YUI components, or it can be used to add one or more components to a page on which some YUI content already exists.
YUI PHP Loader adds value in the following ways:
- Reliable, sorted loading of dependencies: YUI comprises more than two-dozen components, many of which work together to provide the best possible compromise between compartmentalization and code reuse. Because of this, YUI components often need to load with specific dependencies in a specific order. YUI PHP Loader understands which components depend on one another, and based on this knowledge it ensures that the right resources are loaded in the right order.
- Automatic use of rolled-up files. YUI PHP Loader knows about all of the built-in rollup files that ship with YUI — like the yahoo-dom-event.js file that contains the Yahoo Global Object, the Dom Collection, and the Event Utility, three components that are commonly used together. By automatically using rolled-up files when it makes sense to do so, the YUI PHP Loader helps you reduce HTTP requests and thereby keep your page as efficient as possible.
As you think about how you want to load YUI on the page, you may find it useful to refer to this overview of some of the most common loading strategies and their relative merits:
- "Loading YUI: Seeds, Core, and Combo-handling", by Eric Miraglia on YUIBlog.
(Note: While this reference talks mostly about client side loading the basic concepts are still applicable)
On This Page:
Quick Links:
- API Documentation
- Download YUI PHP Loader from YUILibrary.com: YUI PHP Loader is available from the YUI project website, but it is a separate download from the YUI JavaScript/CSS library.
Getting Started
After downloading YUI PHP Loader the archive needs to be extracted somewhere within the servers webroot (e.g.) htdocs/phploader. To begin using the loader you must include the base class file and call the YAHOO_util_Loader constructor with a YUI version number to create an instance of the Loader. The chosen version must have corresponding metadata available within your local YUI PHP Loader installation.
Simple Use Case: Adding YUI Components to the Page with the load() Method
YUI PHP Loader makes it a simple thing to get started using YUI components. After creating an instance of YAHOO_util_Loader tell it what you want to load, and let it sort out all of the dependencies on your behalf. When you are ready to output the CSS and/or JavaScript files simply call the tags() method. Since we will cover the benefits of using rollup files later in this document we will turn them off for this first example.
Configuration Options
The following configuration options are supported by the YUI PHP Loader Utility. These can be set individually on a YUI PHP Loader instance:
| Configuration Option | Purpose |
|---|---|
| base | (string) Allows you to specify a different location (as a full or relative filepath) for the YUI build directory. By default, YUI PHP Loader will serve files from Yahoo's servers. |
| filter |
(string) A filter to apply to result urls. This filter will modify the default
path for all modules. The default path for the YUI library is the
minified version of the files (e.g., event-min.js). The valid filters are:
|
| allowRollups | (boolean) Should Loader use aggregate files (like yahoo-dom-event.js or utilities.js) that combine several YUI components in a single HTTP request? Default: true. |
| loadOptional | (boolean) Should loader load optional dependencies for the components you're requesting? (Note: If you only want some but not all optional dependencies, you can list out the dependencies you want as part of your required list.) Default: false. |
| combine | (boolean) If set to true, YUI files will be combined into a single request using the combo service provided on the Yahoo! CDN |
| comboBase |
(string) The base path to the Yahoo! CDN service. Default: http://yui.yahooapis.com/combo? Note: YUI PHP Loader also ships with an intrinsic, lightweight combo-handler (see combo.php). Refer to the included examples for a use case on this. |
YUI Module Names
Each YUI component has a corresponding module name that is used as a unique identifier within YUI scripts. For example, the Event Utility is internally referred to as "event". YUI PHP Loader loads components based on these unique module names. Here is the full list of YUI module names. All except YUI PHP Loader itself can be loaded via the Loader component.
YUI ships with some aggregate or "rollup" files, each comprising two or more modules, to help you reduce the number of HTTP requests you make while loading YUI content. Each aggregate file has its own module name. Moreover, some modules provide the functionality of one or more modules in the above list.
When you choose to allowRollups, YUI PHP Loader will choose the most appropriate set of files to meet your requirements while using the smallest number of included files. You can also specify an aggregate file directly as a requirement by requesting it by its own module name. The following is a list of modules that aggregate or include multiple modules:
Refining Our Use Case: Cutting out extra HTTP requests
As noted in the configuration table the YUI PHP Loader provides some additional parameters that give us even more control over the loading and performance of our component selections. By simply enabling rollups in this example we can cut down the total HTTP requests from 9 to 5. If we enabled combo handling in addition to rollups we can reduce this down to just 2 HTTP requests; one per tag type (i.e.) link and script.
In addition to the tags() method there are a number of other class methods that will allow you to do things like embed the code inline and fetch the CSS & JavaScript seperately which is not a bad idea since there are well known performance benefits to placing CSS in the document head and JavaScript near the bottom of your document. For more information on these and other methods please refer to the API documents.
Understanding the Metadata
YUI PHP Loader relies on metadata files to calculate module dependencies, rollups, sort order, etc. The metadata files are located in the lib/meta folder. By default YUI PHP Loader ships with metadata for the latest YUI releases; both versions 2 and 3. Additional metadata can be added as needed to support older and/or newer YUI releases. YUI PHP Loader uses pre-built PHP config files first, but is capable of parsing YUI JSON metadata files if no PHP config file is available. The naming convention for PHP config files is config_{yui version}.php (e.g.) config_.php. The naming convention for JSON config files is json_{yui version}.txt (e.g.) json_.txt.
Copyright © Yahoo! Inc. All rights reserved.
Privacy Policy - Terms of Service - Copyright Policy - Job Openings