在最近的项目里面,用到websocket做消息推送,其中有这样的一个效果,在消息列表的模块,接收到很多条信息,展示在界面的是最近的十条接受到的消息,实时更新模块,每次接受一条消息,都会展示在最顶部,旧的消息排列在地下...用js仿写了一个简单的,关于通知栏新消息实时推送更新效果,代码如下: nginx测试 <script src="http://code.jquery.com/jquery-1.8.0.min.<em>js</em>
window.onload 窗口加载完成事件;如果js代码写在body标签之前,则所有的js都要写在window.onload的事件中;即等待窗口加载完成之后再执行!...定时器 setInterval 做返回顶部的动画效果 6....清除定时器 实现步骤: 注册窗口滚动事件 滚动离顶部的距离大于300时,显示ICON 注册点击事件,返回顶部 ==>> 即设置scrollTop 的值为0 用定时器做返回顶部的滚动效果...用定时器做返回顶部的滚动效果 var dsj = setInterval(function(){ var distance = Math.max
背景 大家好,我们是字节跳动 Web Infra 团队,目前团队主要专注的方向包括现代 Web 开发解决方案、低代码搭建、Serverless、跨端解决方案、终端基础体验、ToB 等等。...Node.js 基础设施建设是我们负责的方向之一,包括但不限于: 服务发现:Consul 服务治理:Logger、Metrics、Trace 服务调用:HTTP ( Fetch )、RPC ( Thrift...插件 支持 Node.js、Golang 等后端语言的性能分析平台 维护 Node.js 应用的容器镜像 在 2021 年上半年,由于现有的 Node.js RPC 实现逐渐跟不上字节跳动业务发展节奏...因此,对于想做全栈或者后端 Node.js 的同学来说,早点了解与使用 RPC 是非常有必要的。 既然 RPC 这么重要,那么到底该怎么去理解它呢?...现状 & 需求 在字节跳动内,由于各种原因,存在有多种序列化协议、网络协议,这导致我们没有办法直接使用开源的 Apache Thrift、gRPC,只能选择自建 RPC 实现。
jQuery插件,需要在页面中引入jquery(1.11+)和jquery.scrollex.js文件。...12 调用插件 在页面DOM元素加载完毕之后,你可以通过scrollex()方法来初始化插件。...$(this).css('background-color', ''); } });}); 事件 jquery.scrollex.js插件支持以下一些事件。...Math.max(0, Math.min(1, progress))); } });}); · mode, top和bottom 元素在视口中的位置可以通过mode, top和bottom参数来做进一步的调整
为什么要在这个时候探索flv.js做直播呢?原因在于各大浏览器厂商已经默认禁用Flash,之前常见的Flash直播方案需要用户同意使用Flash后才可以正常使用直播功能,这样的用户体验很致命。...可以看出在浏览器里做直播,使用HTTP-FLV协议是不错的,性能优于RTMP+Flash,延迟可以做到和RTMP+Flash一样甚至更好。...flv.js兼容方案 由于目前flv.js兼容性还不是很好,要用在产品中必要要兼顾到不支持flv.js的浏览器。...缩短这个收集时间(也就是减少GOP长度)可以优化延迟,但这样做的坏处是导致视频压缩率不高,传输效率低。 关闭音视频服务器的I桢缓存可以优化延迟,坏处是用户看到直播首屏的时间变大。...浏览器端开启flv.js的Worker,多进程运行flv.js提升解析速度可以优化延迟,这样做的flv.js配置代码是:{ enableWorker: true, enableStashBuffer
今天这道是字节跳动的: 实现一个批量请求函数 multiRequest(urls, maxNum),要求如下: • 要求最大并发数 maxNum • 每当有一个请求返回,就留下一个空位,可以增加新的请求...应该怎么做? 首先我们来了解一下 Ajax的串行和并行。 基于 Promise.all 实现 Ajax 的串行和并行 我们平时都是基于promise来封装异步请求的,这里也主要是针对异步请求来展开。...这时候,我们就需要考虑对Promise.all做并发限制。
为什么要在这个时候探索flv.js做直播呢?原因在于各大浏览器厂商已经默认禁用Flash,之前常见的Flash直播方案需要用户同意使用Flash后才可以正常使用直播功能,这样的用户体验很致命。...可以看出在浏览器里做直播,使用HTTP-FLV协议是不错的,性能优于RTMP+Flash,延迟可以做到和RTMP+Flash一样甚至更好。...flv.js兼容方案 由于目前flv.js兼容性还不是很好,要用在产品中必要要兼顾到不支持flv.js的浏览器。...缩短这个收集时间(也就是减少GOP长度)可以优化延迟,但这样做的坏处是导致视频压缩率不高,传输效率低。 关闭音视频服务器的I桢缓存可以优化延迟,坏处是用户看到直播首屏的时间变大。...浏览器端开启flv.js的Worker,多进程运行flv.js提升解析速度可以优化延迟,这样做的flv.js配置代码是: 这里是优化后的完整代码 扫码下方二维码, 随时关注更多前端干货文章!
详细的原理可以参考以下文档: RSA算法原理(一) RSA算法原理(二) node-rsa 在 node.js 中使用 rsa 算法,我们使用的是 node-rsa 这个包。
因为MySQL保存着我们爬取的以及自建的数据,对于爬取的数据,数据量比较大,使用mysql 存储会影响mysql的性能,并且我们需要对数据进行流式计算,对数据进...
关注 JS 太久,会养成任何功能都用 JS 实现的习惯,而忘记了 HTML 与 CSS 也具备一定的功能特征。其实有些功能用 JS 实现吃力不讨好,我们要综合使用技术工具,而不是只依赖 JS。...5 things you don't need Javascript for 这篇文章就从 5 个例子出发,告诉我们哪些功能不一定非要用 JS 做。...虽然这做不了特殊动画效果,但如果只为了做一个普通的展开折叠功能,用 HTML 标签就够了。...总结 关于 CSS 可以实现哪些原本需要 JS 做的事,有很多很好的文章,比如: youmightnotneedjs。 You-Dont-Need-JavaScript。...讨论地址是:精读《不再需要 JS 做的 5 件事》· Issue #413 · dt-fe/weekly
function viewportToPixels(value) { var parts = value.match(/([0-9.]+)(vh|vw)/...
电脑版的商城昨晚做完了,今天赶着做手机端的,提到手机端的网站第一个想到的就是要 适应不同手机屏幕的宽度,保证在不同手机上都能正常显示给用户,我之前做这类网站都是无脑引进bootstrap的。...那就要用到js在页面加载时获取window的宽度(浏览器窗口的宽度)$(window).width();在开发手机页面的时候,一般我们设置最大宽度为640px,因为640px可以保证在至今最宽的手机上显示时网页两端刚好贴合屏幕...height:10.6rem; border:1px solid #000; box-sizing: border-box; } js
今天分享的题目来源于 LeetCode 上的剑指 Offer 系列 面试题 22 . 链表中倒数第 k 个节点,这道题在我看来是剑指 Offer 系列里面最简单...
下载地址:http://v3.bootcss.com/getting-started/ 第二步 就是登陆和注册了 写在router文件中 index.js /*ucenter-登录*/router.post
这块实现起来很简单,原生的js实现更简单。为什么写这个呢?
我们都知道,在foreach binding中,使用$index可以得到基于0的索引序号,但在列表显示中,我们更希望这个索引是从1开始的,怎么处理呢?
在一个项目当中,日志系统在项目中重要性在这里就不再累述,log4js是nodejs中的一个日志模块,通过设置其优先级别,可以打印出不同级别的日志,便于后续的系统分析。...下面来介绍一下log4js的具体使用,这里介绍的版本为2.8.0。...log4js的安装 安装很简单 npm install log4js -S log4js配置 在项目的根目录添加一个log目录,在该目录中新建indexjs,开始配置log4js var path =...require("path"); const log4js = require('log4js'); log4js.configure({ appenders: { cheese: {...根据天来创建日志的配置代码如下: var path = require("path"); const log4js = require('log4js'); log4js.configure({ appenders
在上一篇文章介绍了Node.js基础API 接下来我们做一个案例,用Node.js实现静态资源服务器 目录结构 首先新键如下目录结构 config:存放一些配置文件 helper:辅助文件 template...:模板文件(后面会使用到模板引擎) app.js:入口文件 搭建服务 我们要根据客户端请求的url返回相应的文件/目录信息,所以我们要先搭建服务 使用http模块搭建 const http = require...指向某个文件时我们直接返回,当指向某个目录时,我们将该目录的文件全部列出,并且实现超链接,当没有该目录或文件时返回提示信息“没有该文件” 接下来通过代码实现 我们将这部分逻辑写进helper/route.js...我们还引入了自定义模块mime这个模块放置了文件类型对应的contentType,以确保我们发送给客户端正确的contentType helper/mime.js const path = require...(html|js|css|md)/ } 新键helper/compress.js const {createGzip,createDeflate} = require('zlib') module.exports
领取专属 10元无门槛券
手把手带您无忧上云