Primefaces的JavaScript暂缓解析(Primefaces javascript de

2019-10-19 02:27发布

Primefaces 4.0从PageSpeed Insights会看到是产生大量的开销在页面加载过程:

**605.3KiB of JavaScript is parsed during initial page load. Defer parsing JavaScript to reduce blocking of page rendering.**
http://localhost:8888/.../primefaces.js.xhtml?... (219.5KiB)
http://localhost:8888/.../jquery-plugins.js.xhtml?... (191.8KiB)
http://localhost:8888/.../jquery.js.xhtml?... (95.3KiB)
http://localhost:8888/.../tooltip.js.xhtml?... (34.5KiB)
http://localhost:8888/.../jsf.js.xhtml?... (25.4KiB)
http://localhost:8888/.../primefaces-extensions.js.xhtml?... (19.7KiB)
http://localhost:8888/.../watermark.js.xhtml?... (4.7KiB)
http://localhost:8888/.../hotkey.js.xhtml?... (1.2KiB)

任何想法如何,这些第三方JavaScript文件可以被设置为在主体部分,而不是头或使用延迟/异步参数的底部? JavaScript的装载机不要在这种情况下帮助,因为这些是从JSF渲染到来。 此外,我试图创建PreRenderView监听器( 用于JSF推迟的JavaScript解析?最好的方法 ,但没有工作了)。 可能解决这个问题的任何其他的选择吗? 谢谢你的帮助!

Answer 1:

我得到了脚本与followind片段工作的运动:

public class ScriptValidateListener implements SystemEventListener {

    @Override
    public void processEvent(SystemEvent event) throws AbortProcessingException {
        UIViewRoot root = (UIViewRoot) event.getSource();
        FacesContext ctx = FacesContext.getCurrentInstance();
        List<UIComponent> resources = root.getComponentResources(ctx, "HEAD");
        for (UIComponent r : resources) {
            String name = (String) r.getAttributes().get("name");
            if (name == null) {
                continue;
            }

            if (name.contains(".js")) {
                root.removeComponentResource(ctx, r, "HEAD");
                root.addComponentResource(ctx, r, "BODY");
            }
        }
    }

    @Override
    public boolean isListenerForSource(Object source) {
        return (source instanceof UIViewRoot);
    }
}

这使所有的JavaScript从头部到身体的末端。 但。 有这个问题,那Primefaces渲染的成分会尝试访问任何的JQuery($)或PrimeFaces JavaScript函数,这将破坏网页上的所有Ajax功能。 Propably我需要决定脚本的什么动,什么不能移动。 同样来自监听器的一部分,我需要定义以下到faces-config.xml中,使其工作:

<application>
    <system-event-listener>
        <system-event-listener-class>com.example.listener.ScriptValidateListener</system-event-listener-class>
        <system-event-class>javax.faces.event.PreRenderViewEvent</system-event-class>
    </system-event-listener>
</application>


文章来源: Primefaces javascript defer parsing