思考是对我最好的奖励，思考让我深沉，思考让目标明确，让生活多彩！
很多网站都存在图片展示，有图片也伴随着有默认图片的展示，以前从来没有过多的去想，小小的一张默认图片却有如此多的知识和思想在里面；
1.有前后端的分离问题
2.有前端自我优化的问题
3.有用户体验问题
4.前端和后端交互的过程中，那些变与不变的思考
5.问题的答案从来都不是一个
提示：本人思考过后的总结，也可以是思考的草稿，一直不喜欢写文章，是因为自己写出的东西很烂，条理性和逻辑性都不强，由于最近和「李笑来」老师学习写作，自己本身也有这方面的想法，也算是半推半就的开始行动起来了；
我和默认图片之间的故事：
自己在接触默认图片这个概念的时候，应该是很久很久以前，真正自己做默认图片的展示，是15年的某一天，当时的我还很青涩，也只是一个页面制作的小白，记得当时也没有过多的思考这个问题，就让后台把图片地址改成默认图片地址就行了；
但今天回头想想，那些不变的东西，为什么要让后台来做呢，首先后台来做，就需要多一层次的判断，是否有图片，如果没有才传默认图片；以前没有觉得这一个层次有什么大不了的，最近几个月一直接触和围绕性能优化相关的问题和思考，才真的感受到，多一层和少一层相差的远远不是一层；
自己在慕课网学习结构和样式分离的那节课，老师说：
这样一个结构，初级前端、中级前端和高级前端是如何思考的；
三者之间的区别，只是层级的多少，为此我默默地思考了许久，好似恍然大悟，不停的问自己，为什么自己没有深入思考过这个经常出现在嘴边的词语----结构与样式分离；然后我去实践，当时我正好做公司官网首页二期（2017年的2月末），其实是我最开始无法做出我想要的效果，才会出现二期一说的；16年的时候，公司官网首页第二次制作，产品和设计只是简单的说，做个有动画的网站，我当时的心情是很复杂的，有欣喜也有难受，欣喜的是我一直努力希望自己能够做成有动画效果的网站；难受的是我不会，或者说我会的是改变元素widthheight opleftottom ight等一些需要定位，还影响结构展示，性能很差的JS动画；自己光想想就糟透了，在看看别人家的CSS3动画，最后只能是分成两期来做，为了这最后的二期，我整整准备了2个多月，从开始的分析自己不足的知识，和了解一个动画网页应具有的基础知识，加上自己寻找相关知识和教程，再到自己日复一日的学习，到最终的成型，再到优化，再到颠覆；关于动画网站先说到这，发现说了半天有些跑题了；
来做个对比：
我最初认为的默认图片的位置：<img src="图片地址" alt="">
我现在认为的默认图片的位置：
<img src="默认图片地址" alt="">
<img src="展示图片地址" alt="" style="position:absolute;">
简单来说说，我所谓的前后分离，默认图片和展示图片地址不再同一个位置，展示图片加了定位，说明展示图片在默认图片的上方，当没有展示图片的时候，自然就显示默认图片了；
同时又存在一个问题，img标签当图片地址为空的时候，在页面显示一个
残缺的样子，额···，这不是我们要的结果呀；难道需要我们用JS来判断图片是否有链接，但是我们又如何来判断链接是否正确呢，如果不正确的链接或者说链接过去不是图片，那结果不还是一个样子吗？想到这，发现好复杂，还是回去用同一个结构吧！让后台自己解决吧，我们可以喝咖啡去了；
别急，接着思考，我们往回走，想想，图片的展示难道只有这一种吗，还有background-image属性呀！
<style>
.box{
position:relative;
}
.base{
backgorund:url(图片地址) no-repeat center;
background-size:cover;
}
.img{
backgorund:url(图片地址) no-repeat center;
background-size:cover;
position:absolute;
}
</style>
<div class="box">
<div class="base"></div>
<div class="img"></div>
</div>
我们来看上面的代码重新思考，当我们使用background-image的时候，图片就算为空、就算不是图片地址，也不影响展示，因为默认不是图片就不会有任何效果，而下面一直默默等待的默认图片自然就展示给用户看了；
当然，使用img标签和background-image属性，两者各有利弊，而经过我这近三年的实践发现其实都可以用属性的方式来进行展示，当然要是思考语义化和百度爬虫等问题，那就需要对需要的图片使用img标签了，那就采取后台来解决是一件很不错的选择；
小总结：上面的问题，引起了一直存在于自己内心的一个深层次无边界的问题，什么事情是前端来做，什么事情是后端来做；其实关于这个问题很多人都说过，当我看了那些五花八门的答案后依然充满迷茫，经过这次的思考，我得出一个属于我的结论----那就是不变的元素我们应该尽最大努力用前端的方式进行实现，即使是那些需要后台数据的元素，其中也有不变的地方，比如需要后台给出用户的头像地址数据，用户头像地址是变化的量，而不变的量就是默认图片；所以在变化中找到那些不变的量，然后想办法用前端的手段实现我们想要的效果；
同时，当我们用JS做插件的时候，做的多了也有同样一个结论，那就是找到那些不变的规律，然后规律的进行变化，就出现了一个有动态的插件了
其实上面说的，五个优点，可以说他们是相等的关系；
1.前端能做的事尽量去做，减少和后端的交互，自然前后端就分离了
2.不需要后端去判断是否要传默认图片，自然就是优化了，是基于第一种的优化；所以，引起一个概念，什么是优化，优化就是现在这个解决问题的答案前面还有一个答案，那现在这个答案就是优化
3.以前需要后台来进行判断，自然需要后台来传图片，既然判断没有的时候才传图片，自然就会有短暂的空白期，而我们优化后的图片，在页面加载的时候就已经加载完了，而且现在默认图片都可以使用文字形式的icon，加载速度更快
4.找到不变的元素，实现不变的思想，展示出一张变化的网页，给用户最好的体验
5.解决问题本来就不是一个答案，之所以之前是一个答案，那时因为，最开始，我能实现出来，都是问题，自然就是一个答案了；随着自我的成长，答案渐渐的变成了选优