在做一个网站，需要同时适配电脑端与手机端。使用Bootstrap框架，目前有个疑问：
网页上用了很多诸如hidden-xs的样式，在手机端访问时候隐藏，在电脑端访问显示可见。导致一张网页上可能有很多这样区域在电脑端访问时隐藏，但是这些区域中的元素还是在打开网页时被加载了。用多了以后，担心这样的网页加载效率低。
有没有什么方法，在遇到诸如hidden-xs这类隐藏属性时不会加载自动跳过？

hidden-xs是当设备宽度为手机端隐藏，虽然隐藏了，但是DOM节点是渲染了的，想要不加载，除非处理当前这种class类不在页面中渲染

构建dom树的过程其实性能开销并不大，基本可以忽略，只有在渲染的时候才会引起一定的开销。
既然hidden-xs的display属性为none，浏览器默认就不会把内部的dom渲染到页面上，而只是生成对应的dom结构，所以没必要做这方面的优化处理。

相较于html的渲染，js方面其实更吃性能，优化的方向应该放在js方面