PHPackages                             nswdpc/silverstripe-async-loader - 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 &amp; Helpers](/categories/utility)
4. /
5. nswdpc/silverstripe-async-loader

AbandonedArchivedSilverstripe-vendormodule[Utility &amp; Helpers](/categories/utility)

nswdpc/silverstripe-async-loader
================================

An asynchronous assets loader for Silverstripe 4 using loadjs

v0.1.1(7y ago)2280BSD-3-ClausePHP

Since Aug 10Pushed 5y ago1 watchersCompare

[ Source](https://github.com/nswdpc/silverstripe-async-loader)[ Packagist](https://packagist.org/packages/nswdpc/silverstripe-async-loader)[ RSS](/packages/nswdpc-silverstripe-async-loader/feed)WikiDiscussions master Synced 2w ago

READMEChangelog (2)Dependencies (2)Versions (4)Used By (0)

Async Requirements Loader
=========================

[](#async-requirements-loader)

This module provides a backend to load requirements asynchronously using [loadjs](https://github.com/muicss/loadjs)

The goal is to make requirements loading light without blocking page load and to support the separation of critical and non-critical requirements.

> loadjs itself is loaded as an inline script within the page

Supports Silverstripe 4.0+

Usage example
-------------

[](#usage-example)

```
use SilverStripe\View\Requirements;
use NSWDPC\AsyncLoader\Backend as AsyncRequirementsBackend;

```

```
$backend = new AsyncRequirementsBackend();
Requirements::set_backend($backend);

// load requirements in the default bundle (blocking)
Requirements::javascript('path/to/some/requirement.js');
Requirements::javascript('https://example.com/lib_depending_on_requirement.js');
Requirements::javascript('//example.com/load_over_current_protocol.js');

// block requirements as usual
Requirements::block('/something_you_want_to_block.js');

// create a specific bundle
$backend->bundle('fontawesome', ['https://use.fontawesome.com/fa_code.js']);

```

Bundles
-------

[](#bundles)

loadjs uses dependency 'bundles' to manage loading of scripts.

### Default requirements bundle

[](#default-requirements-bundle)

For backwards compatibility scripts loaded via `Requirements::javascript` are loaded by loadjs in series and assigned to the bundle 'requirements\_bundle'

> See [Section 3](https://github.com/muicss/loadjs#documentation) of the loadjs documentation

Once all scripts are loaded, a callback `loadjs_ready_requirements_bundle` is fired and dispatches a DOM event `load_requirements_bundle`

Custom scripts that require a script to be loaded prior to firing can listen for this DOM event:

```
document.addEventListener('load_requirements_bundle', function(e) {
	// custom script
}

```

### Specific bundles

[](#specific-bundles)

Scripts that do not depend on anything loaded in a default bundle can be loaded in a non blocking way in their own bundle:

```
// load fontawesome
$backend->bundle('fontawesome', ['https://use.fontawesome.com/fa_code.js']);

```

Optionally with a callback... if you need to do something after a bundle loads

> See [Section 1](https://github.com/muicss/loadjs#documentation) of the loadjs documentation

```
// load fontawesome
$backend->bundle('fontawesome', ['https://use.fontawesome.com/fa_code.js'], "console.log('fontawesome loaded!');");

```

You can include multiple scripts in the bundle

> See [Section 2](https://github.com/muicss/loadjs#documentation) of the loadjs documentation

```
// load one and two asynchronously (two.js may load before one.js)
$backend->bundle('fontawesome', ['/script/one.js','/script/two.js']);

```

CSS
---

[](#css)

CSS requirements are loaded in blocking mode by default within the `` tag.

You can alternatively load CSS in non-blocking mode via a backend bundle:

```
// load CSS without blocking
$backend->bundle_css('css_bundle', ['path/to/style.css']);

```

Be aware that unless you load in styles that set up a basic/acceptable above-the-fold layout, you will most likely get a FOUC until stylesheets loaded this way are applied. It's fast, but ugly.

> Refer to [Section 5](https://github.com/muicss/loadjs#documentation) of the loadjs documentation on CSS loading notes.

Page placement
--------------

[](#page-placement)

If you wish, place the HTML comment `\` in your page template where you would like JS requirements to be placed. The backend will replace this comment with the JS requirements found. If you do not do this, the JS requirements will be loaded before the closing body tag.

Custom scripts
--------------

[](#custom-scripts)

If you have custom scripts that assume a library is loaded, these will most likely fail unless they are run after their dependency loads. To ensure that they run correctly, apply them in the relevant bundle callback or in an event listener for `load_requirements_bundle`

Custom head tags
----------------

[](#custom-head-tags)

These are loaded prior to the closing head tag.

TODO
----

[](#todo)

- For non-critical CSS, support for 'lazy' loading of Requirements::css() placing a stylesheet `` tag prior to the closing body tag.

Licences
--------

[](#licences)

BSD 3-Clause

- loadjs is licensed under the MIT license:

###  Health Score

27

—

LowBetter than 47% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity14

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity55

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~236 days

Total

2

Last Release

2644d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/1caefd99092b4a43254e48c40347224f671032ec1ffc3a457e06a7e9ab6e7c02?d=identicon)[nswdpc](/maintainers/nswdpc)

---

Top Contributors

[![JamesDPC](https://avatars.githubusercontent.com/u/69664712?v=4)](https://github.com/JamesDPC "JamesDPC (9 commits)")

---

Tags

asyncloadjsrequirementsjavascriptcssperformancesilverstripespeedperfloadjs

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/nswdpc-silverstripe-async-loader/health.svg)

```
[![Health](https://phpackages.com/badges/nswdpc-silverstripe-async-loader/health.svg)](https://phpackages.com/packages/nswdpc-silverstripe-async-loader)
```

###  Alternatives

[matthiasmullie/minify

CSS &amp; JavaScript minifier, in PHP. Removes whitespace, strips comments, combines files (incl. @import statements and small assets in CSS files), and optimizes/shortens a few common programming patterns.

2.0k32.3M424](/packages/matthiasmullie-minify)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
