[vc_row][vc_column][nz_btn text=”Software Resiliency” link=”http://casthighlight.wpengine.com/software-resiliency/” target=”_self” animate=”false” animation_type=”ghost” color=”black” size=”small” shape=”rounded” type=”normal” hover_normal=”fill” hover_ghost=”fill” icon=”icon-dashboard”][nz_btn text=”Code Reliability” target=”_self” animate=”false” animation_type=”ghost” color=”black” size=”small” shape=”rounded” type=”ghost” hover_normal=”fill” hover_ghost=”screen” link=”http://casthighlight.wpengine.com/category/product/indicators-methodology/code-insights/software-resiliency/code-reliability/” icon=”icon-code”][vc_empty_space height=”12px”][vc_row_inner][vc_column_inner width=”1/2″][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

Why you should care

[/vc_column_text][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

Including JavaScript files in HTML is not ideal as some browsers cannot read an external Javascript file and usually renders it completely blank. It usually requires importing a Jquery. Having Javascript files be unreadable in HTML can cause reliability issues.

[/vc_column_text][/vc_column_inner][vc_column_inner width=”1/2″][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

Business Impacts

It is recommended to avoid JavaScript in HTML as it cannot be accessed by browsers making the code unreadable, inaccessible and unproductive. It can also be a waste of resources if the code is designed to be accessed as a website.
[/vc_column_text][nz_btn text=”Production Risk” target=”_self” animate=”false” animation_type=”ghost” color=”pink” size=”small” shape=”rounded” type=”normal” hover_normal=”opacity” hover_ghost=”fill” link=”http://casthighlight.wpengine.com/category/product/indicators-methodology/risk/” icon=”icon-office”][/vc_column_inner][/vc_row_inner][vc_empty_space height=”12px”][vc_empty_space height=”32px”][vc_single_image image=”5362″ img_link_large=”” img_link_target=”_self” img_size=”full” alignment=”none”][vc_row_inner][vc_column_inner width=”1/2″][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

CAST Recommendations

[/vc_column_text][/vc_column_inner][vc_column_inner width=”1/2″][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

References

https://stackoverflow.com/questions/17505563/javascript-file-not-working-when-linked-from-html[/vc_column_text][nz_btn text=”Style Guide” target=”_self” animate=”false” animation_type=”ghost” color=”turquoise” size=”small” shape=”rounded” type=”ghost” hover_normal=”fill” hover_ghost=”fill” link=”https://github.com/Kristories/awesome-guidelines” icon=”icon-book”][/vc_column_inner][/vc_row_inner][vc_separator color=”grey” align=”align_center” style=”” border_width=”” el_width=””][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

How we detect

[/vc_column_text][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]This code insight shows that JavaScript includes are sent by the server each time the page that include it is loaded. If you use the HTML tag to refer to this file, the browser doesn’t have to query for the static content for every page request. Most popular browser like IE, FireFox, Safari, Opera first check their local cache for the static file/resource and only if they don’t find do they make a request to the web server for the same.
For JSP: create a link (html tag) instead of an include. It will be stored in the client cache instead of being sent each time the page is loaded [/vc_column_text][vc_row_inner][vc_column_inner width=”1/1″][vc_single_image image=”5362″ img_link_large=”” img_link_target=”_self” img_size=”full” alignment=”none”][vc_column_text pl=”0″ pr=”0″ pt=”0″ pb=”0″]

[/vc_column_text][vc_empty_space height=”16px”][nz_btn text=”See features” link=”http://casthighlight.wpengine.com/outputs-analytics/” target=”_self” icon=”icon-stats” animate=”false” animation_type=”ghost” color=”black” size=”small” shape=”rounded” type=”normal” hover_normal=”fill” hover_ghost=”fill”][nz_btn text=”How it works” link=”http://casthighlight.wpengine.com/how-it-works/” target=”_self” icon=”icon-cog” animate=”false” animation_type=”ghost” color=”black” size=”small” shape=”rounded” type=”ghost” hover_normal=”fill” hover_ghost=”fill”][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]