26 天前 / 噶牛爱尚
首发于小郭话前端写文章CSS浏览器兼容性，最完整处理方案一郭鲜前端“鲜”肉 , 同名公众号“一郭鲜”5 人赞同了该文章前端是一个让人又爱又恨的职业，爱,是因为技术更新快，发展道路宽阔；恨的是需要学习、掌握的东西太多太多，永远学不完，正如俗话说：活到老，学到老；但更让人头疼的是，还要面临各种适配、兼容性问题。 网上对适配、兼容性问题都有相关解答，但一直以来都是头痛医头脚痛医脚，没有进行系统的梳理，整个思路和方向全是混乱的，所以最近整理了一份CSS浏览器兼容性的常见解决思路和方案，分享给大家，一起进步。 浏览器兼容性问......
31 天前 / 噶牛爱尚
自我介绍 我是来自RichLab 花呗借呗前端团队的同学。在公司大家喊我玄寂，生活中大家称呼我 pigcan 或者猪罐头。除了是一个程序员，我现在也在尝试做一名YouTuber和up 主，也在微信公众号中分享我的生活，我自己的方式践行快乐工作，认真生活。 体感案例 首先为了让大家有更好的体感，我们先来看一个案例。这个案例是使用 code mirror 加 Antd tab 组件加 Gravity 做的一个实时预览。大家可以通过这个 gif 能看到，我变更 js 文件或者样式文件的时候，在右侧这个预览区域可以进行实时的更新，这部分的能力是完全......
35 天前 / 大数据学徒
本文介绍KafkaFlow[1]，一个可以在浏览器里生产数据和消费数据的工具，包括它的安装方法和使用方法。因为我自己经常需要登录到服务器上用命令行消费或者生产数据，命令很长，参数也多，敲起来十分繁琐，所以就有了 KafkaFlow，希望可以帮到有同样需求的你。 代码已上传至 github：https://github.com/iamabug/kafka-flow 电脑端阅读：https://juejin.im/post/5dfdc66851882512756e977e 或 https://www.jianshu.com/p/da737f9e1dde 内容提要： 1.安装方法2.使用方法3.源码编译4.总结 1. 安装方法在 github 的 releases 页面下载二进制压缩包：......
71 天前 / 冷星1024
一个 CSS 属性引发的血案 Web 页面性能是前端开发特别需要关注的重点，评判前端 Web 页面性能的指标有很多，页面的流畅度是其中的一种，如何让页面变得 “柔顺丝滑”，要讨论起来可就是个相当有料的话题了。之前开发移动端 H5 页面的时候，就遇到过一个有趣的性能问题 —— 某个卖场页面在 IOS 手机上出现了严重的卡顿，但在安卓机型下却表现得十分流畅。归纳一下在 iPhoneX 上测试的具体表现： 页面加载时存在明显的延迟，但通过代理抓到的网络请求耗时并不比 Android 的高； 页面滚动时会出现短暂的局部白屏，即丢帧。 根据这些表征情况不难推......
75 天前 / 噶牛爱尚
前言双十一后稍微空闲了下来，得以有时间来研究一下之前一直在看的垂直域的技术的东西。目前，跑在浏览器端的web IDE产品越来越多，按照他们的功能特性来做划分的话，目前的web IDE可以分为两种，一种是将本地IDE的功能基本原封不动的迁移到了web端的IDE，像是目前最流行的前端IDE VS Code最近发布的重磅！微软发布 Visual Studio Online：Web 版 VS Code + 云开发环境，借助于云+容器化的能力，在浏览器端VS Code拥有着跟本地IDE几乎完全一样的功能，除此之外，完全online的一致的开发体验以及跟云端环境的无缝对接还带来了无数无数（故意重复）的......
78 天前 / vivaxy
介绍图像可以用多种不同的类型数据表示，本文将它们归纳为 5 种类型：DOM，URL，File，ImageData 和 Buffer。 图像的数据类型DOM``[1] 元素从 URL（Data URL，HTTP URL 或 Object URL）加载图像。 ``[2] 元素通过 canvas API `drawImage`[3] 来获取 元素上的图像数据。 URLData URLData URL[4] 带有 base64 编码的图像数据。可以从 Data URL 数据中解码出图像的二进制数据。Data URL 数据的大小比原始的二进制数据大一些。 HTTP URLHTTP URL[5] 代表存储在服务器上的图像。HTTP URL 用于从服务器获取图像数据。 Object URLObject URL[6] 用来......
81 天前 / ithuangqing
这次是干货，有多干？ 正文共：5879字87图 完了，怕你们看不下去，我特意整理了PDF给大家，传送地址： https://github.com/ithuangqing/Chrome-take-off 有胆量就看吧 1、Chrome浏览器与其扩展程序 这是啥，这是一款强大的浏览器，几乎是程序员必备，使用起来贼爽，而且颜值还高，为啥推荐它，因为这是大部分人的选择啊，我们先来看一个统计： 这是一个专业的分析浏览器使用情况的网站上的统计，可以看到chrome霸王龙般的存在啊！所以没有使用的赶紧安装上，大众的眼睛是雪亮的。 另外，我得告......
94 天前 / 冷星1024
前言前段时间在研究前端异常监控/埋点平台的实现。 在思考方案时，想到了浏览器自带的观察者以及页面生命周期API 。 于是在翻查资料时意外发现，原来现代浏览器支持多达四种不同类型的观察者： Intersection Observer，交叉观察者。 Mutation Observer，变动观察者。 Resize Observer，视图观察者。 Performance Observer，性能观察者 1. IntersectionObserver：交叉观察者IntersectionObserver接口，提供了一种异步观察目标元素与其祖先元素或顶级文档视窗(viewport)交叉状态的方法，祖先元素与视窗(viewport)被称为根(root) 1. 出......
124 天前 / Lara
原文链接：dev.toJavasSript 很奇怪，目前在 JavasSript 中存在八种（近似）ECMAScript 语言类型（在本文发表时）。我们倾向于说 JavasSript 中的所有内容都是一个对象，但事实并非如此。实际上， 虽然在 JavasSript 中大多数东西表现得像对象，但这并不意味着它们真的是对象。因此，深入研究 JavasSript 中存在的有效类型是一件以备不时之需的好事情。 在继续之前，我想说清楚：我指的是 一般值类型 ，而不是 基本类型 的概念。如果我指的是基本类型，那么就不会讨论对象，那是需要再找一天讨论的另一种不同的 JS 问题。 那么现在，为了深入这 8......
126 天前 / 噶牛爱尚
前言浏览器的渲染原理是每个前端开发工程师的必修课，网络上也有很多这方面的文章，但大多数只是告诉你浏览器表现就是这样的，并没有一个直观的认识，让人读完就瞬间忘却。 所以小编决定通过node实践来模拟浏览器渲染时的一些场景，对市面上的文章的一些观点进行验证，希望能够加深自己的认识。 动手实践之前，先了解下浏览器的渲染机制的一些基本知识，如下图所示： DOM：Document Object Model，浏览器将HTML解析成树形的数据结构，简称DOM。 CSSOM：CSS Object Model，浏览器将CSS代码解析成树形的数据结构。 Render Tree：DOM 和 CSSOM 合......
142 天前 / Lara
这是系列文章的第11篇，专门探讨 JavaScript 及其构建组件。在识别和描述核心元素的过程中，我们还分享了一些在构建 SessionStack时使用的经验法则。SessionStack 是一个需要强大且高性能的 javaScript 应用程序，以帮助用户实时发现并重现他们的 Web 应用程序缺陷。 如果你想阅读系列的其他文章，请看下方： 引擎、运行时和调用堆栈的概述 Google V8引擎内部 + 5个关于如何编写优化代码的建议 内存管理 + 如何处理4个常见内存泄漏 事件循环和异步编程的兴起 + 5种更好地使用async/await编码的方法 深入剖析 WebSockets 和 使用 SSE 的 HTTP/......
163 天前 / 算法与编程之美
欢迎点击「算法与编程之美」↑关注我们！ 本文首发于微信公众号："算法与编程之美"，欢迎关注，及时了解更多此系列文章。 深入理解浏览器内核 - 概述上一篇文章介绍了互联网及万维网的概念，了解了浏览器是万维网的入口，是获得信息资源的工具，因此各大厂商都在争夺浏览器的市场。本文将为大家介绍目前的浏览器市场状况及其各自使用的内核。 截至到目前为止，各浏览器厂商的全球市场占有率如下图所示： 图1- 1各大浏览器市场占有率 数据来源： http://gs.statcounter.com/browser-market-share 该统计包含了桌面、手机、平......