web前端

AJAX 跨域解决方案

什么是AJAX ?

AJAX 是无需刷新页面就能够从服务器去的数据的一种方法,负责Ajax运作的核心对象是XMLHttpRequest(XHR)对象。

同源策略是对XHR的一个主要约束,它为通信设置了“相同的域、相同的端口、相同的协议”这一限制。
试图访问上述限制之外的资源都会引发安全错误,除非采用被认可的跨域解决方案。

这个方案叫做CORS(Cross-Origin Resource Sharing)跨源资源共享。…

    

10 张图秒懂UI和UX 到底有何不同?

UI 和 UX 到底有什么不同?
如果说 UX 设计师是一个站在 4000 米山上远眺产品整体格局的人,那么UI设计师则是一个拿着显微镜检视产品细节部分的角色。UX 设计师关注产品带给用户的感受,着眼整体,UI 关注细节。
一图胜千言,我们整理了来自网络上的 10 张图,告诉你 UI 和UX 到底有何不同?…

聊一聊前端存储那些事儿

欢迎大家收看聊一聊系列,这一套系列文章,可以帮助前端工程师们了解前端的方方面面(不仅仅是代码):https://segmentfault.com/blog/frontenddriver

在web开发越来越复杂的今天,前端拥有的能力也越来越多。其中最重要的一项莫过于web存储。开发者们如果使用得当,这些存储可以帮助我们提升网页的性能与灵活度。本文不讲个中的细节,只讲各种前端存储的利弊,与各类存储的应用场景。毕竟这些技术的细节在网上随处可见,如果读者你决定使用的话,再去细查也不迟。我们前端人手里都有哪些存储武器,都用在什么地方,请读者随我一一聊开去......…

    

浏览器缓存知识小结及应用

浏览器缓存,也就是客户端缓存,既是网页性能优化里面静态资源相关优化的一大利器,也是无数web开发人员在工作过程不可避免的一大问题,所以在产品开发的时候我们总是想办法避免缓存产生,而在产品发布之时又在想策略管理缓存提升网页的访问速度。了解浏览器的缓存命中原理,是开发web应用的基础,本文着眼于此,学习浏览器缓存的相关知识,总结缓存避免和缓存管理的方法,结合具体的场景说明缓存的相关问题。希望能对有需要的人有所帮助。…

响应式图像

自从2010年Ethan Marcotte开始讨论响应式网页设计,开发者和设计师们竞相寻求处理响应式图片的方法。这的确是一个棘手的问题 ,因为我们对同一个网站在众多设备宽度下,使用同一图像源。你愿意在一个大显示屏上显示模糊地、马赛克状的图像?你愿意在你的手机上加载一个巨大的(虽然更漂亮的)图像?这个问题令人左右为难。

一群来自响应式问题社区组(RICG)的聪明家伙致力于解决这个难题,他们使picture元素和srcsetsizes属性纳入HTML 5.1规范草案 。因为我们无法预测用户在何地以及如何访问我们的网站,所以我们需要浏览器自身根据情况选择最好的图像。新规范将解决以下问题:…

通过pjax实现无刷新翻页(兼容新版jquery)

pushState是一个可以操作history的api,该api的介绍和使用请见这里:http://www.welefen.com/use-ajax-and-pushstate.html

目前已经有http://github.com/, http://plus.google.com, http://www.welefen.com 等网站已经使用。

pjax是对ajax + pushState的封装,让你可以很方便的使用pushState技术。

同时支持了缓存和本地存储,下次访问的时候直接读取本地数据,无需在次访问。

并且展现方式支持动画技术,可以使用系统自带的动画方式,也可以自定义动画展现方式。…