I have common css and js files that i include in every jsp file.
So what's the best practice to include them in every page ?
I used to use <%@ include file="header.jsp" %>
but I'm wondering if this is the best and clean way to proceed.
I have common css and js files that i include in every jsp file.
So what's the best practice to include them in every page ?
I used to use <%@ include file="header.jsp" %>
but I'm wondering if this is the best and clean way to proceed.
You can try this without any framework, in your web.xml
:
<jsp-config>
<jsp-property-group>
<display-name>Display</display-name>
<url-pattern>*.jsp</url-pattern>
<el-ignored>false</el-ignored>
<scripting-invalid>false</scripting-invalid>
<is-xml>false</is-xml>
<include-prelude>/template/header.jsp</include-prelude><!-- header -->
<include-coda>/template/footer.jsp</include-coda><!-- footer -->
</jsp-property-group>
</jsp-config>
See more here
I like using fragments for this, they are standard supported by JSP so no other dependencies are needed. And as you will see it will comes with lot's of other benefits.
Create a tag (parentpage.tag):
<%@tag description="Base page" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@attribute name="extra_css" fragment="true" %>
<%@attribute name="footer" fragment="true" %>
<%@attribute name="header" fragment="true" %>
<html>
<head> ....
// insert css that is needed for every page
<jsp:invoke fragment="extra_css"/>
<jsp:invoke fragment="header"/>
<jsp:doBody/>
<jsp:invoke fragment="footer"/>
Then you create individual pages that inherit from this tag
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="t" tagdir="/WEB-INF/tags" %>
<t:parentpage>
<jsp:attribute name="extra_css">
// custom css for this page
</jsp:attribute>
<jsp:attribute name="footer">
// footer content
</jsp:attribute>
<jsp:body>
// body content
</jsp:body>
</t:parentpage>
Yes! It can be a good option to have all the css and js defination in one jsp and then include that jsp in all pages/jsp.
As you are using spring i would suggest you use tiles https://tiles.apache.org/ that is the much better way to make a standard layout and then use that layout in your all jsp.
The best solutions is to use JSP Tag File. It allows to encapsulate reusable content using Tag Files : Java doc ref
Here is a good answer with example : https://stackoverflow.com/a/3257426/1140748
Make JavaScript and CSS External.
Using external files in the real world generally produces faster pages because the JavaScript and CSS files are cached by the browser. JavaScript and CSS that are inlined in HTML documents get downloaded every time the HTML document is requested. This reduces the number of HTTP requests that are needed, but increases the size of the HTML document. On the other hand, if the JavaScript and CSS are in external files cached by the browser, the size of the HTML document is reduced without increasing the number of HTTP requests.
Follow these links to get more info on this: