真正了解前端技术的工程师都会感觉前端技术发展变化太快。浏览器特性、前端框架、前端工具、多终端浏览器等都在快速迭代中。作为前端工程师不仅要掌握现有的技术去实现业务需求,更要不断的学习新的技术、新的理念,时刻准备着新技术浪潮的来临。
❝ 本文介绍一些与前端数据存储有关,「有趣、好玩、有用」的开源库。除此之外,还会让你掌握各种 Web 存储方案的特点,赶紧来了解一下。 ❞
前端的数据存储方式,你除了用过 Cookies、localStorage 和 sessionStorage 外,还有用过其它的存储方式么?其实除了前面提到的 3 种存储方式,目前主流的浏览器还支持 Web SQL 和 IndexedDB。
以下描述的变化适用于测试版通道发布的安卓系统、Chrome OS系统、苹果系统和Windows系统上最新版的Chrome浏览器,注明除外。
随着前端技术栈在服务端和移动端上的尝试和日益成熟,前端工程师的追求绝不只是页面上的技术,如何实现跨服务端,如何扩展到移动端开发将变成主要讨论议题。
今天介绍 GitHub 上 大家最受欢迎的 10 个开源项目,在这些项目中,你有在用或用过哪些呢?
插件功能 平时对我来说最浪费时间的莫过于刷「知乎」,但是手贱停不下来呀。Chrome 上面装了个 StayFocusd,设定十分钟之后就屏蔽 zhihu 域名。但有时候是真的要上知乎查些东西,每次还得关掉,可一关掉就会「忘记」打开。 我希望能有个人能每隔5分钟就提醒我一次,你今天刷了5分钟了,你今天刷了10分钟了,你今天刷了15分钟了。。。讲真,我觉得这种提醒既温和又有效,当然,也可以变得很不温和,比如把提醒直接发给老板。 本文代码已经放在 github 上了:dingding_robort/chrome_
介绍 本文是关于客户端存储(client-side storage)的。这是一个通用术语,包含几个独立但相关的 API: Web Storage、Web SQL Database、Indexed Database 和 File Access。每种技术都提供了在用户硬盘上 —— 而非通常存储数据的服务器 —— 存储数据的独特方式。这么做主要基于以下两点理由:(a)使 web app 离线可用; (b)改善性能。对于客户端存储使用情况的详细阐述,请看 HTML5Rocks 上的文章 《"离线": 这是什么意思
这是我在 NFT 市场中发现的一个令人兴奋的安全问题,它允许我通过链接 IDOR 和 XSS 来接管任何人的帐户,以实现完整的帐户接管漏洞。
越来越多的大型项目趋于 web 化,在浏览器中运行交互复杂的大型项目时,若每步交互都向后端提交 ajax 请求,除了增加服务器的负担外,等待相应的延迟也会降低用户体验。在前端项目中,使用 localstorage 进行数据缓存已是司空见惯的做法,但由于数据分布式地存储在多个前端浏览器中,因此数据的版本管理终究是绕不开的话题。
👋 你好,我是 Lorin 洛林,一位 Java 后端技术开发者!座右铭:Technology has the power to make the world a better place.
这段时间对项目做了一次整体的优化,全站有了20%左右的提升(本来载入速度已经1.2S左右了,优化度很低),算一算已经做了四轮的全站性能优化了,回顾几次的优化手段,基本上几个字就能说清楚:
Web 浏览器简称为浏览器,是一种用于访问互联网上信息的应用软件。浏览器的主要功能是从服务器检索 Web 资源并将其显示在 Web 浏览器窗口中。
本部分主要是笔者在复习 HTML 相关知识和一些相关面试题时所做的笔记,如果出现错误,希望大家指出!
隐身模式或私有模式会使用单独的用户配置文件,在浏览器重新启动之后不会保留 Cookie,localStorage或缓存文件之类的数据。每个会话都会以干净的状态开始,所以非常适合测试登录功能、首次渲染性能和PWA程序。
React Router 提供一个routerWillLeave生命周期钩子,这使得 React组件可以拦截正在发生的跳转,或在离开route前提示用户。routerWillLeave返回值有以下两种:
浏览器内核又可以分成两部分:渲染引擎和 JS 引擎。 渲染引擎主要负责取得网页的内容、整理讯息、计算网页的显示方式等,JS 引擎则是解析 Javascript 语言,执行 javascript 语言来实现网页的动态效果。
由于没有提前做好复习,所以有点匆忙,腾讯一面问的不难,从vue,react,webpack等等,倒是没准备好,导致回答的满头大汗~~
本篇文章为大家盘点了1月份最热门的 JavaScript 项目,让我们一起来看下吧! 一、编辑器tui.editor https://github.com/nhnent/tui.editor Star 5033 tui.editor(TOAST UI Editor)是一款所见即所得的Markdown编辑器。TOAST UI Editor提供Markdown模式和WYSIWYG模式。它的功能非常强大,你可以编辑表格,UML图和图表等。 TOAST UI Editor的Markdown模式的特点有: ● 所见即
当 cookie 被首次引入时,它是浏览器保存数据的唯一方式。之后又有了很多新的选择:Web Storage API、IndexedDB 和 Cache API。那么 cookie 死了吗?我们来看看这些在浏览器中存储数据的技术。
按照项目流程,一般是UI设计师设计好产品界面,前端工程师通过编码实现界面。通俗来说,UI设计师好比服装设计师,而开发工程师好比裁缝。
这个过程要注意标签位置,以及script标签位置和HTML提供的async defer属性
调试时使用最多的功能页面是:元素(ELements)、控制台(Console)、源代码(Sources)、网络(Network)等。
Chrome扩展是一种可以在Chrome浏览器中添加新功能和修改浏览器行为的软件程序,例如我们常用的TamperMonkey、Proxy SwitchyOmega、AdGuard等等,这些拓展都是可以通过WebExtensions API来修改、增强浏览器的能力,用来提供一些浏览器本体没有的功能,从而实现一些有趣的事情。
Promise是可以链式调用的,由于每次调用 .then 或者 .catch 都会返回一个新的 promise,从而实现了链式调用, 它并不像一般任务的链式调用一样return this。
本文由哔哩哔哩前端工程师 墨白 翻译分享 我喜欢移动app,而且也是那些坚持使用Web技术构建移动应用程序的人之一。 经过技术的不断迭代(可能还有一些其它的东西),移动体验设计愈来愈平易近人,给予用户
越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率。尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录后的Chrome的,非常方便啊。
Cookie是最早被提出来的本地存储方式,在此之前,服务端是无法判断网络中的两个请求是否是同一用户发起的,为解决这个问题,Cookie就出现了。Cookie的大小只有4kb,它是一种纯文本文件,每次发起HTTP请求都会携带Cookie。
当我们去面试的时候,很大概率会被面试官问这么一个问题:你有尝试过对项目做性能优化吗?或者你了解哪些性能优化的方法?听到这个问题的你可能是这样的:
Vue 组件销毁时,会自动清理它与其它实例的连接,解绑它的全部指令及事件监听器,但是仅限于组件本身的事件。 如果在 js 内使用 addEventListener 等方式是不会自动销毁的,我们需要在组件销毁时手动移除这些事件的监听,以免造成内存泄露,如:
2020年10月,美团安全运营平台发现流量中存在恶意JavaScript请求,信息安全部收到告警后立即开始应急处理,通过对网络环境、访问日志等进行排查,最终锁定恶意请求由Chrome浏览器安装恶意插件引起,该恶意JavaScript文件会窃取Cookie并强制用户跳转到恶意色情站点、推广链接等,结合美团威胁情报大数据,发现该插件与Lnkr Ad Injector木马特征吻合。
导语:本文从市面主流的浏览器及相应的内核引擎开始,介绍了Chromium为代表的浏览器架构及Blink内核的功能架构。Chromium为多进程架构,用户从启动运行浏览器后,先后经过页面导航、渲染、资源加载、样式计算、布局、绘制、合成到栅格化,最后完成GPU展示。而页面渲染完成后,浏览器如何响应页面操作事件也进行了深入的介绍。良心推荐! 本文第二至五部分内容根据 Mariko Kosaka 的英文原版《Inside look at modern web browser》(见参考文献),进行翻译、理解
得益于 Vue 的 响应式系统 和 虚拟 DOM 系统 ,Vue 在渲染组件的过程中能自动追踪数据的依赖,并精确知晓数据更新的时候哪个组件需要重新渲染,渲染之后也会经过虚拟 DOM diff 之后才会真正更新到 DOM 上,Vue 应用的开发者一般不需要做额外的优化工作。
随着移动网络的发展与演化,我们手机上现在除了有原生 App,还能跑“WebApp”——它即开即用,用完即走。一个优秀的 WebApp 甚至可以拥有和原生 App 媲美的功能和体验。WebApp 优异的性能表现,有一部分原因要归功于浏览器存储技术的提升。cookie存储数据的功能已经很难满足开发所需,逐渐被WebStorage、IndexedDB所取代,本文将介绍这几种存储方式的差异和优缺点。
有时候为了在手机上调试网页,大都是大费周章,有的使用Chrome DevTools远程链接手机调试,有的使用专门的工具或者浏览器调试,现在腾讯开源了一个vConsole的工具,就解决了这一个痛点!
本文从黑产攻击方式、木马恶意行为、监控及防御方案等角度对Lnkr木马进行分析,此类木马影响范围较广,攻击手法多样,但目前国内相关的资料却非常稀少,希望本文的实践经验和总结能对从事相关安全检测的同学有所帮助。
对于喜欢豆瓣FM的同学来说,没有歌词是件令人苦恼的事,下面我就来总结下怎样为豆瓣FM写一个chrome的歌词插件。 1.需要的技能 首先,你要会javascript,其次你要掌握一点chrome的hack,最后要有一个可以根据歌曲名查到歌词的API。 2.localStorage localStorage与cookie类似,它是存储在客户端浏览器中的数据,它与cookie不同的一点是它没有时间限制。localStorage属于html5中的新特性。因为我们要做chrome的插件,所以按F12弹出开发者模式,
Promise本身是同步的立即执行函数, 当在executor中执行resolve或者reject的时候, 此时是异步操作, 会先执行then/catch等,当主栈完成后,才会去调用resolve/reject中存放的方法执行,打印p的时候,是打印的返回结果,一个Promise实例。
HTML&CSS: 对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:布局、盒子模型、选择器优先级、 HTML5、CSS3、Flexbox
近年来,网络开发的迅速演变,尤其是在前端开发领域。这种转变主要归功于无数涌现的框架和技术,它们旨在简化和增强构建引人入胜的用户界面的过程。然而,由于现有框架的丰富多样以及不断涌现的新框架,跟上前端趋势已成为一项艰巨的任务。对于新手来说,很容易感到不知所措,仿佛迷失在广阔的选择海洋中。
以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题,通过对知识的整理以及经验的总结,重新巩固自身的前端基础知识,如有错误或更好的答案,欢迎指正。: )
跨站脚本攻击(Cross-site scripting,通常简称为XSS)发生在客户端,可被用于进行窃取隐私、钓鱼欺骗、偷取密码、传播恶意代码等攻击行为。可以分为反射型、存储型、DOM型等,本文主要讲解DOM-XSS漏洞挖掘与攻击面延申。接下来就开门见山,讲解干货吧。
前端性能优化与重绘与回流有关系的原因是:频繁的触发重绘与回流,会导致UI频繁染,最终会导致js变慢,会导致页面性能变差
今天我们将继续介绍 GitHub 上 9 月份最受欢迎的 11 个开源项目,在这些项目中,你有在用或用过哪些呢? 1 tensorflow https://github.com/tensorflow/tensorflow Stars 68835 TensorFlow 是谷歌的第二代机器学习系统,按照谷歌所说,在某些基准测试中,TensorFlow 的表现比第一代的 DistBelief 快了 2 倍。TensorFlow 内建深度学习的扩展支持,任何能够用计算流图形来表达的计算,都可以使用 TensorF
领取专属 10元无门槛券
手把手带您无忧上云