We have some component-wise JS under /apps/[project]/components/[component_name]/. It works fine in author instance for admin as admin has read permission over /apps. While at Publish Instance, anonymous has no right to read /apps therefore anonymous will receive 404 over these JS.
Refer to [1] we can use etc/design/[project]/clientlibs to embed the JS and CSS. Anonymous can read this clientlibs so that the 404 problem is solved.
However, these component-wise JS are embedded in every pages, even which do not contain the corresponding component. It generates JS error in our case.
Let's say we have a component A which will print out <div id="component_A">***</div>, with a JS component_A_JS in clientlibs $("#component_A").doSomething, this component_A_JS is embedded in etc/design so that every page will load this js.
For a page containing component A, there will be a <div id="component_A">, the JS works fine. While if a page doesn't have component A, there will be js error saying #component_A is not found. JS stops.
What's Adobe's recommendation over this issue?
[1] http://www.i-cubed.com/best-approaches-to-client-libraries-in-adobe-cq5-part-1/