lockandload
Advanced tools
Comparing version 1.1.8 to 1.1.18
{ | ||
"name": "lockandload", | ||
"version": "1.1.8", | ||
"version": "1.1.18", | ||
"description": "Minimalist AMD-compliant Javascript and CSS loader", | ||
@@ -9,4 +9,3 @@ "main": "index.html", | ||
"test": "# Can only be tested inside a browser environment.", | ||
"prepublish": | ||
"sed -e '/^[\t ]*\\/\\//d' <annotated.html >index.html" | ||
"prepublish": "./prepfiles" | ||
}, | ||
@@ -17,6 +16,10 @@ "dependencies": {}, | ||
"repository": { | ||
"type": "git", "url": "git://github.com/BuGlessRB/lockandload" | ||
"type": "git", | ||
"url": "git://github.com/BuGlessRB/lockandload" | ||
}, | ||
"keywords": [ | ||
"AMD", "loader", "minimal", "boilerplate" | ||
"AMD", | ||
"loader", | ||
"minimal", | ||
"boilerplate" | ||
], | ||
@@ -23,0 +26,0 @@ "author": "Stephen R. van den Berg <srb@cuci.nl>", |
@@ -1,5 +0,5 @@ | ||
<h1>lockandload</h1> | ||
<h1>lockandload AMD-loader</h1> | ||
Lockandload is a minimalist AMD-loader-compatible boilerplate to kickstart | ||
your website/single-page-app. | ||
your website. It includes special support for single-page-apps. | ||
@@ -18,3 +18,3 @@ Gzipped, the essential script content amounts to roughly 1KB of code. | ||
- Because it is inlined, it is faster than all other loaders. | ||
- Fully asynchronous script loader: AMD-compatible. | ||
- Fully asynchronous script loader: AMD-loader compatible. | ||
- Supports anonymous define() calls. | ||
@@ -27,4 +27,3 @@ - Supports local require() calls (with one and two arguments). | ||
- No extra diagnostic code to minimise code weight and optimise loading speed. | ||
- Mostly event driven, no polling timers except for the scss() helper | ||
function. | ||
- Fully event driven, no polling timers. | ||
- Standard supported dependencies: `require` and `domready`. | ||
@@ -49,4 +48,31 @@ - Both high and low priority asynchronous loading of Javascript and CSS files. | ||
Copy `index.html`, `main.js`, `lastjs.js` and `css/main.css` boilerplate | ||
files to your own new website, and start adjusting them to taste. | ||
### Using npm | ||
Running `npm install lockandload` in the webroot of your site, | ||
should create the following file and directory structure: | ||
- `node_modules` | ||
- `lockandload` | ||
- `lockandload_master.inc`: Placed right after the charset definition | ||
on the page. | ||
- `lockandload_headready.inc`: The start of the headready script that | ||
lives at the end of the `<head>`. | ||
- `lockandload_trailer.inc`: The end of the headready script that lives | ||
at the end of the `<head>`. | ||
- `index.php`: PHP boilerplate. | ||
- `main.js`: Example SPA (Single Page Application). | ||
### Using PHP | ||
Copy the boilerplate `node_modules/lockandload/index.php` file to your | ||
webroot; then customise the copied file to taste. | ||
### Using other serverside scripting languages | ||
Look at the PHP boilerplate `node_modules/lockandload/index.php`, and | ||
translate this to your own scripting language. | ||
### Without serverside scripting | ||
Copy the `node_modules/lockandload/index.html` boilerplate | ||
file to your webroot; then customise the copied file to taste. | ||
The `index.html` contains two `<script>` sections. The first section | ||
@@ -61,7 +87,2 @@ should not be preceded by any other `<script>` tags and should be left | ||
Whenever this loader is updated, you can expect the first script section | ||
to be able to be replaced as is, and in the second script section you | ||
will be able to replace the first part, up till your configurable area. | ||
Backward and forward compatibility will be retained within those constraints. | ||
The basic structure of a page should be: | ||
@@ -88,5 +109,5 @@ - html | ||
Look at `annotated.html` to understand the code and read additional | ||
inline documentation. This `index.html` file is not present in the git | ||
source repository, it can only be found in the npm repository (or after running | ||
`npm run prepublish`). | ||
inline documentation. These `index.*` and `lockandload_*.inc` files are not | ||
present in the git source repository, they can only be found in the npm | ||
repository (or after running `npm run prepublish`). | ||
@@ -109,14 +130,11 @@ ## API | ||
### Locally | ||
In the secondary `lockandload` 'headready' script; all path arguments | ||
are used verbatim in `<link href="path">` or `<script src="path">` tags: | ||
- `scss(id, path)`<br /> | ||
Loads additional ordered css files asynchronously; after the stylesheet | ||
has been applied, it fulfills the `id` dependency. | ||
- `css(path)`<br /> | ||
Loads additional low priority ordered css files asynchronously. | ||
- `js(path)`<br /> | ||
Loads additional low priority unordered Javascript files asynchronously. | ||
- `sjs(path)`<br /> | ||
Loads additional low priority ordered Javascript files sequentially | ||
yet asynchronously (as a group). | ||
In the secondary `lockandload` 'headready' script; all url arguments | ||
are used verbatim in `<link href="url">` or `<script src="url">` tags: | ||
- `css(url, id?)`<br /> | ||
Loads low priority ordered css files asynchronously; | ||
after the stylesheet has been applied, it fulfills the optional | ||
`id` dependency. | ||
- `js(url, "async"?)`<br /> | ||
Loads Javascript file, if the second optional argument `"async"` is | ||
provided, the load will be asynchronous. | ||
@@ -130,4 +148,4 @@ ### Dealing with jQuery | ||
The standard `headready` script contains a dependency on `domready` and | ||
`jquery` which then at the end runs `domready()` which will run all the | ||
registered delayed functions. | ||
`jquery` which finally runs `domready(1)` which will run all the | ||
registered delayed functions the first time. | ||
@@ -141,3 +159,4 @@ ### SPA (Single Page App) support | ||
To run the registered functions, one needs to make a call to the entrypoint | ||
of the AMD-dependency on `domready`. | ||
of the AMD-dependency on `domready` without arguments. All `domready()` | ||
calls before `domready(1)` has been run will silently be ignored. | ||
@@ -164,2 +183,3 @@ E.g. in your application, you could use code like this: | ||
- [source repository](https://github.com/BuGlessRB/lockandload). | ||
- [Sample site that uses lockandload](https://remixml.org/). | ||
- [Asynchronous Module Definition | ||
@@ -166,0 +186,0 @@ (AMD)](https://github.com/amdjs/amdjs-api/blob/master/AMD.md). |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Deprecated
MaintenanceThe maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.
Found 1 instance in 1 package
Trivial Package
Supply chain riskPackages less than 10 lines of code are easily copied into your own project and may not warrant the additional supply chain risk of an external dependency.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Deprecated
MaintenanceThe maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.
Found 1 instance in 1 package
Trivial Package
Supply chain riskPackages less than 10 lines of code are easily copied into your own project and may not warrant the additional supply chain risk of an external dependency.
Found 1 instance in 1 package
26054
15
187