推荐
最新
热榜
其他
啥是佩奇? SVG 线条动画告诉你。

啥是佩奇? SVG 线条动画告诉你。

前言首先祝大家2019新年快乐，万事大吉，猪事顺利，阖家欢乐。前面文章《SVG线条动画基础入门知识》学习到了基础知识，现在来给大家讲讲如何制作SVG制作复杂图形线条动画。假如你有这样的一个gif，要用svg画出来，你能想到什么办法了？上面这个SVG线条动画的路径path，如果自己手工一个点一个点定位调试画出来的话，估计你的累趴下（也不一定能搞定）。下面我来告诉大家一个简单的方法，准备好工具。使用PS导出路径导入图片用魔术棒or套索工具,选择区域右击-->建立工作路径-->容差2个像素吧（可以用不同大小的容
其他
说说地址栏输入 URL 敲下回车后发生了什么？

说说地址栏输入 URL 敲下回车后发生了什么？

一、简单分析简单的分析，从输入URL到回车后发生的行为如下：URL解析DNS查询TCP连接HTTP请求响应请求页面渲染二、详细分析URL解析首先判断你输入的是一个合法的URL还是一个待搜索的关键词，并且根据你输入的内容进行对应操作URL的解析第过程中的第一步，一个url的结构解析如下：DNS查询在之前文章中讲过DNS的查询，这里就不再讲述了整个查询过程如下图所示：最终，获取到了域名对应的目标服务器IP地址TCP连接在之前文章中，了解到tcp是一种面向有连接的传输层协议在确定目标服务器服务器的IP地址后，则
其他
使用预渲染提升SPA应用体验

使用预渲染提升SPA应用体验

前言在目前的前端领域，单页web应用（SPA）已经有了比较高的占有率，比较主流的web框架React、Angular、Vue几乎已经统治了前端市场。单页应用确实带来了更好的前后端分离，以及用户体验好、快，内容的改变不需要重新加载整个页面等等的优点，喜忧参半，SPA应用首屏加载慢、白屏以及SEO等问题也就慢慢显露出来。问题的来源是SPA应用采用的是客户端渲染，DOM节点要等待JS文件加载完毕后才会生成，所以就浮现了以上几个问题。为了解决以上问题，目前有两个比较主流的解决方案：1、服务端渲染（SSR）2、预渲
其他
怎么理解回流跟重绘？什么场景下会触发？

怎么理解回流跟重绘？什么场景下会触发？

怎么理解回流跟重绘？什么场景下会触发？一、是什么在HTML中，每个元素都可以理解成一个盒子，在浏览器解析过程中，会涉及到回流与重绘：回流：布局引擎会根据各种样式计算每个盒子在页面上的大小与位置重绘：当计算好盒模型的位置、大小及其他属性后，浏览器根据每个盒子特性进行绘制具体的浏览器解析渲染机制如下所示：解析HTML，生成DOM树，解析CSS，生成CSSOM树将DOM树和CSSOM树结合，生成渲染树(RenderTree)Layout(回流):根据生成的渲染树，进行回流(Layout)，得到节点的几何信息（位
其他
说说你对BOM的理解，常见的BOM对象你了解哪些？

说说你对BOM的理解，常见的BOM对象你了解哪些？

说说你对BOM的理解，常见的BOM对象你了解哪些？一、是什么BOM(BrowserObjectModel)，浏览器对象模型，提供了独立于内容与浏览器窗口进行交互的对象其作用就是跟浏览器做一些交互效果,比如如何进行页面的后退，前进，刷新，浏览器的窗口发生变化，滚动条的滚动，以及获取客户的一些信息如：浏览器品牌版本，屏幕分辨率浏览器的全部内容可以看成DOM，整个浏览器可以看成BOM。区别如下：二、windowBom的核心对象是window，它表示浏览器的一个实例在浏览器中，window对象有双重角色，即是浏览
其他
实现Web端指纹登录

实现Web端指纹登录

前言现在越来越多的笔记本电脑内置了指纹识别，用于快速从锁屏进入桌面，一些客户端的软件也支持通过指纹来认证用户身份。前几天我在想，既然客户端软件能调用指纹设备，web端应该也可以调用，经过一番折腾后，终于实现了这个功能，并应用在了我的开源项目中。本文就跟大家分享下我的实现思路以及过程，欢迎各位感兴趣的开发者阅读本文。实现思路浏览器提供了WebAuthenticationAPI,我们可以利用这套API来调用用户的指纹设备来实现用户信息认证。最终的实现效果视频，请移步：web端指纹登录注册指纹首先，我们需要拿到
下拉加载更多
猜你喜欢
换一换
最新文章
更多