PHPackages                             kktsvetkov/assoto - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. kktsvetkov/assoto

ActiveLibrary[Utility & Helpers](/categories/utility)

kktsvetkov/assoto
=================

Simple assets management for enqueuing your JS and CSS files, your meta tags, etc.

v0.1.2(7y ago)1391LGPL-3.0PHPPHP >=5.3.0

Since Feb 27Pushed 7y ago1 watchersCompare

[ Source](https://github.com/kktsvetkov/Assoto)[ Packagist](https://packagist.org/packages/kktsvetkov/assoto)[ Docs](https://github.com/kktsvetkov/Assoto)[ RSS](/packages/kktsvetkov-assoto/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (3)DependenciesVersions (4)Used By (0)

Assoto
======

[](#assoto)

Dynamically handles assets inserted into the header and the footer, allowing you to enqueue your JS and CSS files, your meta tags, etc.

What's this for ?
-----------------

[](#whats-this-for-)

Web performance best practices recommend that:

- load all your stylesheets in the `...` portion of the page. In this way the browser loads stylesheets early and will use them to correctly render the page. If this rule is not followed, you are going to see pages that change their look and layout in the middle of loading - which is when the stylesheets have been loaded.
- load all your Javascript at the bottom of the page just before the closing `` tag. The `` tags block and freeze rendering of HTML by the browser, because potentially the Javascript can alter the contents of the page and modify its structure.

Following these rules, you will often need to prepare Javascript scripts and files, stylesheets and meta tags *BEFORE* are you ready to render a page. This is what **Assoto** is meant to help with. It will collect your assets in advance, and then deliver them when you start printing your page.

Stacks
------

[](#stacks)

While preparing to render a page, you start accumulating your assets. This happens by *stacking* them in what is called "stacks". There are two stacks:

- **"head"** (`Assoto\Stack::STACK_HEAD`) for the `...` portion of the page,
- **"footer"** (`Assoto\Stack::STACK_FOOTER`) for the bottom of the page just before the closing `` tag.

Following the best practices **Assoto** will put all your stylesheets in the "head", and all your scripts at the bottom in the "footer".

To see what's already added in a stack call `Assoto\Stack::stack($stack)`. If you want to reset a stack and empty it call `Assoto\Stack::reset($stack)`.

How to use ?
------------

[](#how-to-use-)

You start by stacking your assets.

```
	/* adds my.js as javascript file asset */
	Assoto\JS::file('my.js');

	/* adds my.css as stylesheet asset */
	Assoto\CSS::stylesheet('my.css');

	/* adds the  tag as asset */
	Assoto\HTML::title('Hello World!');
```

When it is time to render the page, you call to `Assoto\Stack::display()` to print the accumulated assets in the stacks. Here's an example with a very crude PHP page:

```