novotna/async-control

Trait for asynchronous control rendering

AsyncControl

Trait for asynchronous control rendering., _(*1)

, _(*2)

Useful for loading data from external sources or any time-expensive controls., _(*3)

, _(*4)

Requirements

• Nette/Application

Installation

The best way to install PeckaDesign/AsyncControl is using Composer:, _(*5)

$ composer require pd/async-control

Usage

Trait

<?php
class CommentsControl extends Nette\Application\UI\Control {

    use Pd\AsyncControl\UI\AsyncControlTrait;

    public function render() {
        //control rendering
    }
}

If you want to call different method than render set custom render callback:, _(*6)

<?php
$this->setAsyncRenderer([$this, 'customRender']);
//or
$this->setAsyncRenderer(function () {
    //control rendering
});

Template

{control comments:async}

or with custom message, _(*7)

{control comments:async 'Show comments'}

Frontend

Without any javascript this trait will show only load button. With simple script you can automatically load all asynchronous components on page load using nette ajax extension src/assets/async.nette.ajax.js. Alternatively you can implement your own handling, e.g. component loading while scrolling through page. This is handy if you have long pages. You do not need to wait till all data are loaded and you can show main data much faster. Additional data will be loaded depending on your JS implementation right after page load or on demand., _(*8)

Configuring

You can set default message and attributes used for loading link in bootstrap.php, _(*9)

<?php
Pd\AsyncControl\UI\AsyncControlLink::setDefault('Load content', ['class' => ['btn', 'ajax']]);

or in application setup, _(*10)

services:
    application:
        setup:
            - Pd\AsyncControl\UI\AsyncControlLink::setDefault('Load content', {class: [btn, ajax]})

Search engines

To allow indexing of your site by crawlers you need to add meta tag to your page., _(*11)

<meta name="fragment" content="!" n:if="$presenter->getParameter('_escaped_fragment_') === NULL">

If you place into the page www.example.com, the crawler will temporarily map this URL to www.example.com?escaped_fragment= and will request this from your server. Your server should then return the HTML snapshot corresponding to www.example.com, _(*12)

When parameter _escaped_fragment_ is present in url AsyncControlTrait will always render its content., _(*13)

If you want the same behaviour for visitors of your page with disabled JS, add additional meta tag within noscript tag:, _(*14)

<noscript n:if="$presenter->getParameter('_escaped_fragment_') === NULL">
    <meta http-equiv="refresh" content="0;url=?_escaped_fragment_="/>
</noscript>

To avoid extra load on your servers and crawlers use these tags only on pages containing controls with trait AsyncControlTrait., _(*15)