0

可能是目前最强大的开源在线表格,不信你来看看

现在在线的办公套件使用频率越来越高,不论是国外的Google 办公套件还是国内的石墨文档,金山文档等,都是很优秀的产品。开源领域里也有不少优秀的在线表格开源项目,那么今天所推荐的 Luckysheet 究竟有什么不同之处呢?那就继续往下看看吧。 项目名称:Luckysheet项目作者:mengshukeji开源许可协议:MIT项目地址:https://gitee.com/mengshukeji/Luckysheet项目简介Luckysheet 是一款纯前端类似 Excel 的在线表格,功能强大、配置简单、完全开源。Luckysheet 独有特性矩阵计算 (通过右键菜单进行支持:对选区内的数据进...

阅读全文>>

0

前端ES6中Promise的运行原理

Promise的作用它是异步编程的一种方式,它比传统的异步回调和事件更合理也更优雅!从Promise的使用中能看出什么?首先我们手写一个常见的使用方式//demo1new Promise(function (resolve, reject) { resolve('123')}).then(function (value) { return value;}).then(function (value1) { return value1;}).catch(function(e) { return e;})从这个demo中就可以看出来,首先需要定义一个Promise的构造函数、then方法以及cat...

阅读全文>>

0

学会常见的配色原理,再也不怕后期调色啦

调色是大家学习摄影后期时的一大难题。其根源并不在于我们不明白各种调色工具的使用,而是大家常常缺乏思路,不知道怎样搭配色彩才舒服、好看。 其实在色彩的搭配上,美术、设计等学科,早已探索出了很多的规律,可以被我们摄影师借鉴学习。 要学习色相的搭配,首先要认识RYB色环(又叫伊顿12色相环),这个色环是以红黄蓝这三种颜色为原色的色环。色环上一共有12种主要颜色。在0度位置是黄色,120度位置是红色,240度位置是蓝色。黄色和红色之间,有黄橙、橙、红橙三种颜色。红色和蓝色之间,有紫红、紫、蓝紫三种颜色。在蓝色和黄色之间,有青、绿、黄绿三种颜色。基于RYB色环,有以下的常见色彩搭配模型:单色搭配 单色搭...

阅读全文>>

0

WebSocket心跳检测和重连机制

1. 心跳重连原由心跳和重连的目的用一句话概括就是客户端和服务端保证彼此还活着,避免丢包发生。websocket连接断开有以下两种情况:前端断开在使用websocket过程中,可能会出现网络断开的情况,比如信号不好,或者网络临时关闭,这时候websocket的连接已经断开,而不同浏览器有不同的机制,触发onclose的时机也不同,并不会理想执行websocket的onclose方法,我们无法知道是否断开连接,也就无法进行重连操作。后端断开如果后端因为一些情况需要断开ws,在可控情况下,会下发一个断连的消息通知,之后才会断开,我们便会重连。如果因为一些异常断开了连接,我们是不会感应到的,所以如果...

阅读全文>>

0

细说websocket快速重连机制

引言在一个完善的即时通讯应用中,websocket是极其关键的一环,它为web应用的客户端和服务端提供了一种全双工的通信机制,但由于它本身以及其底层依赖的TCP连接的不稳定性,开发者不得不为其设计一套完整的保活、验活、重连方案,才能在实际应用中保证应用的即时性和高可用性。就重连而言,其速度严重影响了上层应用的“即时性”和用户体验,试想打开网络一分钟后,微信还不能收发消息的话,是不是要抓狂?因此,如何在网络变更时快速恢复websocket的可用,就变得尤为重要。快速了解websocetWebsocket诞生于2008年,在2011年成为国际标准,现在所有的浏览器都已支持。它是一种全新的应用层协议...

阅读全文>>

0

前端flex布局基础学习教程

FlexiableBox即是弹性盒,用来进行弹性布局,一般跟rem(rem伸缩布局(转))连起来用比较方便,flexbox负责处理页面布局,然后rem处理一些flex顾及不到的地方(rem伸缩布局主要处理尺寸的适配问题),布局还是要传统布局的。flex-插图1布局的传统解决方案,基于盒状模型,依赖display属性 +position属性 +float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能。Flex布...

阅读全文>>

0

在bootstrap中col-md-offset-*不起作用

在bootstrap中,使用col-md-offset-1、col-md-offset-2、col-md-offset-3、col-md-offset-4等来设置偏移量很常见,但最近就遇到一个问题了,在最新版的bootstrap4.5中,这个值不起作用了。 <div class="container"> <div class="row"> <div> <h2 class="col-md-4 col-md-offset-1">...

阅读全文>>

0

Bootstrap3和Bootstrap4有哪些区别

Bootstrap3和Bootstrap4区别 首先引入Bootstrap3和4官网连接; Bootstrap3 VS Bootstrap4. 不同点 Bootstrap3/Bootstrap4 Less/Sass语言编写 4种栅格类/5种栅格类 使用px为单位/使用rem和em为单位(除部分margin和padding使用px) 使用push和pull向左右移动/偏移列通过offset-类设置 使用float的布局方式/选择弹性盒模型(flexbox) 注:Bootstrap3的4种栅格: 特小(col-xs-) 适配手机(<768px)...

阅读全文>>

1

深入理解浏览器的缓存机制

一、前言 缓存可以说是性能优化中简单高效的一种优化方式了。一个优秀的缓存策略可以缩短网页请求资源的距离,减少延迟,并且由于缓存文件可以重复利用,还可以减少带宽,降低网络负荷。 对于一个数据请求来说,可以分为发起网络请求、后端处理、浏览器响应三个步骤。浏览器缓存可以帮助我们在第一和第三步骤中优化性能。比如说直接使用缓存而不发起请求,或者发起了请求但后端存储的数据和前端一致,那么就没有必要再将数据回传回来,这样就减少了响应数据。 接下来的内容中我们将通过缓存位置、缓存策略以及实际场景应用缓存策略来探讨浏览器缓存机制。 二、缓存位置 从缓存...

阅读全文>>

0

你的Input框还有很多有趣的功能等着你去展现

<input /> 标签是我们日常开发中非常常见的替换元素了,但是最近在刷 whattwg 跟 MDN 的时候发现 跟 <input /> 有很多相关的属性,选择器都没怎么用过,所以就开篇文章来整理一下一些比较有趣或者实用的知识点。本篇文章默认大家已经知道 <input /> 标签的基本用法,不会做过多的基础说明~没想到,这些选择器居然跟 input …到写文章为止,根据最新的 drafts 指出,一共有3大类,16种跟 input 相关的选择。其实都挺有用的,善用它们,会让我们的用户体验更加美好。下面我们来分享一下这3大类选择器的作用:第一类:控制系(In...

阅读全文>>