SF
前端小鱼儿
前端小鱼儿
注册登录
关注博客
注册登录
主页
关于
RSS
css相关
雨花石
2022-02-11
阅读 2 分钟
1.5k
(1)将浏览器的渲染过程交给GPU(graphics processing unit)处理,而不是使用自带的比较慢软件的渲染器,可以让animation和transition更加顺畅。(GPU和CPU的渲染机制不一样)(2)原理:创建一个新的复合图层(通过css的3D或者CSS transform;<video>和<canvas>标签;CSS filters;元素覆盖,比如z-index...
vue的组件通信(父子之间、非父子之间)
雨花石
2022-02-09
阅读 2 分钟
1.1k
(1) v-model(input的修饰符.lazy, .number, .trim),.sync(父组件:title.sync="myTitle",子组件要this.$emit('update:title', this.title + ':: after update'))语法糖,在表单控件或者组件上创建“双向绑定”。
vue原理相关总结
雨花石
2022-02-08
阅读 3 分钟
2.7k
一、vue2.0的双向绑定是怎么实现的 {代码...} 二、数据不更新的问题 {代码...} 三、computed和watch和methods {代码...} 四、vue-router的模式区别 {代码...} 五、vuex解决了什么问题 {代码...} 六、nextTick是怎么是实现的 {代码...} 七、keep-alive内置组件和LRU算法(队列) {代码...}
自动化构建工具(二):特性
雨花石
2022-01-04
阅读 1 分钟
945
原理:通过“不停轮询文件的修改时间“,缓存一批更新 {代码...} 以上只是达到了热重载,要想热更新,需要配合webapck-dev-server和HotModuleReplacementPlugin实现。
数据结构和算法(二):复杂度分析
雨花石
2022-01-04
阅读 1 分钟
1k
{代码...} 时间复杂度假设:每行代码执行的时间都一样,为unit_time分析原因:测试结果依赖测试环境和数据规模,所以不能事后分析,需要事前粗略估计。大O复杂度表示法:不具体表示代码真正的执行时间,只代表代码执行时间随数据规模增长的变化趋势,也叫渐进时间复杂度,简称时间复杂度。复杂度排序:O(1) < O(logn)...
数据结构和算法(一):概览
雨花石
2022-01-04
阅读 1 分钟
932
数据结构和算法关系: {代码...} 重点 {代码...} 10个数据结构: {代码...} 10个算法: {代码...}
单测方法论---1
雨花石
2021-02-19
阅读 2 分钟
1k
Vue.js允许使用Vue Webpack模板进行非常简单且准备就绪的测试设置,该模板已经包含用于单元测试(使用Karma和Mocha)和E2E测试(使用Nightwatch)的样板。
模块化es6 module和commonjs
雨花石
2020-01-16
阅读 2 分钟
2.6k
模块化表格对比 模块规范 导出命令 导入命令 静态还是动态 值是否被缓存 是否采用严格模式 加载是否是同步的 适应端 顶层this指向哪里 es6 module export import 静态 值的引用,不会缓存,运行时再根据引用去取值 是 浏览器和服务端 undefined commonjs module.exports require 动态,运行时加载 会缓存 同步 服务端 指...
javascript高级程序设计---6继承
雨花石
2020-01-15
阅读 7 分钟
1.5k
继承对象 主要实现原理:通过原型链继承~~~~ 所以先来了解下原型链 {代码...} Parent是Function的实例。 {代码...} 所有函数的默认原型都是Object的实例。 {代码...} 继承的原型链图 继承模式总结比较 继承模式 优点 缺点 可以用instance或者isPrototypeOf判断类型吗 原型链基础 Child.prototype = new Parent();重写了...
css常见布局
雨花石
2020-01-09
阅读 3 分钟
1.6k
此方法利用padding把每个子元素的高度撑的超出父元素,再利用margin的负值把父元素下面的块向上移和padding相同的距离,将加上的padding盖掉,不理解的可以尝试把下面的注释去掉,并自己调节margin的值看看效果。当然,此方法要记得把父元素设置为超出部分不可见,要不然,试试出滚动条的效果,就很尴尬了~
前端脚手架scaffold实践
雨花石
2020-01-09
阅读 3 分钟
3.2k
相信大家在开发过程中都遇到这样的问题:为了新建项目,要不停地拷贝文件,配置什么的,或者干脆从零开始,这样是非常浪费时间的。这个时候,一个善解人意的scaffold就很被大家需要了,它可以仅用简单的命令就帮助我们完成项目的创建,编译打包,发布等工作,让我们可以专注于我们的核心业务。总体来说,一个贴心的scaff...
自动化构建工具(一):原理与设计
雨花石
2020-01-08
阅读 2 分钟
3k
日常的前端开发工作中,相信大家一定接触过前端工程化体系,而自动化构建工具,比如webpack,就是前端工程化体系中很重要的一部分。下面就结合自己在工作中的实践,总结一下所看所想:
typescript---mixins
雨花石
2019-12-29
阅读 2 分钟
1.5k
除了传统的面向对象继承方式,还流行一种通过可重用组件创建类的方式,就是联合另一个简单类的代码。 {代码...} TODO: 这个方式让我想起了一个问题,接口和类的区别?(后端语言的和js在这里各有什么不同)
javascript高级程序设计---6创建对象
雨花石
2019-12-28
阅读 6 分钟
1.3k
七种创建模式表格对比:循序渐进解决问题 当然不能忘记es6的class 创建模式 解决的问题 未解决的问题 是否能使用instanceof检测类型 工厂模式 解决了重复调用函数的问题 不能具体识别对象的类型(都是从Object来的) 可以 构造函数模式 解决了识别对象的问题 每个方法都要在实例上重新创建一遍,即每个Person实例都包含...
docker,一种新型的虚拟化方式
雨花石
2019-11-18
阅读 2 分钟
1.5k
1、容器和虚拟机的区别:容器更轻便虚拟机:虚拟一套硬件,在其上运行一套操作系统,再运行应用容器:没有虚拟硬件,容器没有自己的内核,应用直接运行于宿主的内核
git关联本地文件和远程仓库
雨花石
2019-07-03
阅读 1 分钟
11.4k
平时自己有一些本地的项目想把它们放到github上去,就需要关联一下。 步骤一: 在本地想放到github上的项目的根文件夹执行git init。 步骤二: 在github上新建一个仓库Repository,得到仓库地址。比如[链接] 步骤三: 本地项目根文件夹执行: {代码...} 步骤四: 关联之后,就可以进行拉取远程代码和提交本地代码到远程...
git 重命名远程分支名
雨花石
2019-06-20
阅读 2 分钟
21.6k
开发的时候手一抖,把新建的分支名字单词给写错了并且已推送到了远程,有洁癖的我绝对不能忍,那就赶紧改掉吧。照着网上的教程操作了一遍,果然没错,现总结给大家。比如,把远程的test-branch改成new-test-branch。
css1:盒模型
雨花石
2019-05-24
阅读 2 分钟
1.4k
最近工作中有机会复习一下css的基本知识,那么先从css的盒模型开始吧,因为这是当时进现在这家公司笔试的第一题:怎么把IE盒模型变成标准盒模型?
踩了pointer-events:none的坑
雨花石
2018-06-28
阅读 1 分钟
8.9k
bug解决:情急之下,在所有需要点击的img标签外边都包了一层div,把点击事件移到div上,ok了,但是并不知道做了什么导致了这样的问题。
js的对象和数组,引用类型的理解
雨花石
2017-09-13
阅读 2 分钟
5.3k
虽然自己知道数组和对象是引用类型,在赋值的时候要小心,但是今天还是翻了个错,所以再次写了个demo帮助自己: 1、众所周知,数组就是引用类型的 2、为了防止arr1被改变,所以我们要拷贝一份 3、我天真地以为数组再拷贝一份就不会出现1中的情况了,那么,如果数组里面的元素是对象呢?(对象也是引用类型) 4、所以要把...
js中this的四种使用场景
雨花石
2017-09-03
阅读 3 分钟
7.7k
最近读到了一篇介绍js中this的四种使用场景的文章,感觉总结的很好,所以我认真读了读,并且动手实践了其中的demo,与大家共享。原文链接:[链接]遇到this,一直要记得这句:函数执行时,this总是指向调用该函数的对象(即:判断this所在的函数属于谁)。
初学mongoose(1)
雨花石
2017-08-04
阅读 1 分钟
2.3k
最近学习用nodejs做博客系统,用了express框架。数据库采用mongodb,具体用mongoose实现,下面是mongoose的初步了解1、首先要安装mongoose npm install mongoose2、 //db.js
js实现鼠标拖拽多选功能
雨花石
2017-07-31
阅读 6 分钟
11.5k
最近做了一个用js实现鼠标拖拽多选的功能,于是整理了一下思路,写了一个小demo:遮罩出现:被遮罩盖住的,即为选中的块(背景色为粉色)下面是具体代码,注释已在文中,与大家交流。
win10启动mongodb教程(win10 以管理员模式进入及其重要)
雨花石
2017-07-30
阅读 1 分钟
2k
win10启动mongodb: {代码...} win10 以管理员模式进入及其重要: {代码...} 感谢网上的教程~~~
把平级数据变成树形数据
雨花石
2017-07-28
阅读 2 分钟
4.8k
为了记住这个方法:转化数据 {代码...} 为以下这种格式的,为写树形插件做准备 具体代码如下: {代码...}
nth-last-child()和nth-last-of-type()的用法和区别
雨花石
2017-07-26
阅读 1 分钟
4.3k
细细品味,nth-last-child()和nth-last-of-type()还是有child和type的区别的。若是改变了span和最后一个p的位置,就会发现p:nth-last-child()不起作用了,因为div的倒数第二个元素不是p。
抛砖引玉css系列---根据父元素包含的子元素个数,实现不同的样式
雨花石
2017-07-26
阅读 3 分钟
11.2k
工作时遇到这样一个问题:根据某元素所包含的子元素个数,分别设置不同的样式,这个用js可以解决,不过个人认为用css解决可能更简单一点。这也正好加深了我对css选择器的理解和运用。demo如下:
用margin和定位实现垂直居中
雨花石
2017-06-30
阅读 1 分钟
1.7k
{代码...} 截图如下:
利用translate实现垂直居中
雨花石
2017-06-30
阅读 1 分钟
2k
{代码...} 截图如下:
终于找到一种有效的垂直居中方法
雨花石
2017-06-27
阅读 1 分钟
2.3k
今天终于发现了一种有效的垂直居中方法(块级元素里面的块级元素居中),写了个demo试了一下。不过此方法要求父级元素和自己元素都有定位,且自己元素要有明确的高宽。demo如下:
1
(current)
2
下一页
1
(current)
下一页