在 Mac 上运行低版本 Chrome 浏览器
假设你想体验历史版本的 Chrome,或是进行兼容性测试工作,亦或是复原用户的问题现场,你都需要在本机安装一份低版本 Chrome 浏览器。
假设你想体验历史版本的 Chrome,或是进行兼容性测试工作,亦或是复原用户的问题现场,你都需要在本机安装一份低版本 Chrome 浏览器。
九月的某一天,QA 同学反馈在 OPPO R9 中打开我们的 H5 页面时遭遇白屏。
本文分享我给 CodeSandbox 提 PR 并被 merged 的体验。
Temporal,它旨在为 JavaScript 提供全新的日期、时间、时区、日历处理 API,以解决原有 Date 对象的不足。
在 React 框架中,我们尝尝会使用 useEffect 来重复发送请求,当遇到请求覆盖时,又该如何优雅地解决呢?
我所在的 TikTok 杭州团队,主要负责直播间的营收活动,通过上榜、做任务、1v1 PK 等玩法激励用户和主播充值送礼,活动投放地区涉及中东、欧洲、东南亚……,所以国际化是研发流程中不可或缺的一环。传统的 RTL 布局、时区转换、本地化解决方案在新特性的加持下,会发生怎样奇妙的化学反应,这篇文章就来聊一聊~
白屏(Blank Screen),它无所不及,摧枯拉朽,令用户体感全失、测试提 P0 相见、研发不寒而栗,胆战心惊,只知匆忙回滚。对于离用户最近的前端,更是重灾区,浏览器上只要出现白屏,先找前端准没错。近期工作中频频遇到线上白屏事故,我借这个机遇,介绍为什么会产生白屏,以及应对之道。
CSS Grid Layout,又称网格布局、栅格布局,是我认为现代 Web 开发最高效的布局方式,它创造性的改动就是将流式布局、Flex 布局等传统一维布局方式上升到二维,这波属于降维打击。在网页排版中,我们往往只能沿 X 轴或 Y 轴单个方向排布元素,CSS Grid Layout 允许我们同时沿着 X、Y 轴排布元素。
不同于国内的活动,国际化活动投放大量地区,这些地区有着不同的语言体系、阅读风格,意味着界面布局上要进行相应的适配,以获得更好的用户体验。本文介绍如何利用 Sass(CSS 预处理器)@mixin and @include 特性去优雅解决国际化 UI 布局。
inquirer.js 是一个基于询问式的命令行工具,能简化用户在终端的交互输入,那么它必然依赖于 Node 环境,而不是我们熟知的浏览器环境(基于 ES11 发布已经近一年的事实,市面上的现代浏览器早已支持 ?? 操作符)。
从 2020 年 7 月 22 号以校招身份入职字节跳动至今,一年期已满。时至今日,我用文字记录下我的心路历程,希望带给初为职场人的同学们一点浅薄的经验,同时勉励自己,Always Day 1.
正所谓「需求」是程序员的第一生产力,正是有了 PM 和 UI 千奇百怪的要求,才会使我们的编程技能(CSS)进一步上升。
查阅资料后,才明白这是 Android WebView 的默认行为,其根本原因是 video 没有设置 poster 属性,所以自作聪明的 Android WebView 给它加了默认 poster(海报、封面)。
在使用 Koa 框架搭建网站时,一般返回 index.html 当做入口文件,这需要设置特定的 response header.
AbortController 是一个控制器对象,你可以通过 new 构造函数的形式返回一个 AbortSignal 对象。
有了 useImperativeHandle 的存在,ref.current 可以不仅仅被赋值为一个 DOM 对象,还可以是一个普通对象,对象里的方法,可以访问子组件的任意变量。
文档还指出 Date、NaN、Infinity...等类型都会被 JSON.stringify 简易处理,不能保证序列化前后数据的一致性。既然原生 API 靠不住,便自己手写一个深拷贝,主要遇到了三个难题:调用栈溢出、循环引用、复杂数据类型。
在实际工作中,为了百分百还原设计师们精致而又严格(变态)的设计稿,我们经常需要借助一些 CSS-Tricks 来保障页面的高还原度,不然设计妹子的像素眼分分钟找出遗漏点,向你发难。
虽然在日常工作中经常使用 React 框架,但是对受控组件和非受控组件的概念十分模糊。
Canvas API 提供了一个通过 JavaScript 和 HTML 的 canvas 元素来绘制图形的方式。它可以用于动画、游戏画面、数据可视化、图片编辑以及实时视频处理等方面。除了以上的内容,还可以直接绘制 DOM。
这阵子在工作中参与了业务的抽象,计划打造通用组件并发布成 npm 包便于后续项目的共建,自然而然,学习到了一些关于 package.json 之前没有接触到的知识点。
React Hooks 正凭借其 Function Component 的特性,已经在实际项目中被广泛应用,而对于逻辑是重复且可被复用的组件,借助第三方 React Hooks 库来加快开发效率无疑是正确的选择。
CommonJS 输出的是一个值的拷贝;ES Modules 生成一个引用,等到真的需要用到时,再到模块里面去取值,模块里面的变量,绑定其所在的模块。
注意!这里的重定向逻辑并不发生在 JS 层面,而是指 HTTP 层面,所以需要在服务端(Node)或者 Nginx 上进行设置,即指定关键的响应首部字段 Location 和 状态码 Status Code.
之前在实习过程中,接触过有关地理定位的需求,业务场景是通过 H5 页面获取用户的所处位置,很自然想到了 Web API 中的 navigator.geolocation.
Koa 作为搭建 NodeJS 服务时最常用的 web 框架,其源码并不复杂,但却实现了两个核心要点:中间件(Middleware)流程控制,又称“洋葱式模型”。将 request(IncomingMessage object)和 response(ServerResponse object)挂载到上下文(ctx)中。
何况,在标准的开发流程中,我们还需引入 单元测试、覆盖率报告、代码风格检测 ……,并将应用部署到 不同环境的服务器(开发、测试、生产)中,这无疑是一项繁琐的工作,本着 不想当运维的前端不是一个好全栈 的核心思想,我迫切需要解放我的双手。
以前从没去系统了解过网页字体,但它却时时刻刻在影响用户的体验,作为前端的一部分,其重要性不言而喻,在此,记录我对字体的一些疑问和新特性解析。
前段时间,我更换了博客的主题,博客是使用 Gatsby 搭建的,它基于 React ,利用 Markdown 搭配 GraphQL,可帮助开发者快速构建博客站点。但在我安装依赖包时却掉入了天坑,此文用于记录我的脱坑过程。
虽然从字面上看不出显式访问,但不要忽略了一个重要条件,即非严格相等运算符 ==,它会将等式两边的值做出相应的隐式转换(又称强制类型转换)再进行比较。而隐式转换的最终目的,是将等式两边的值都转换为原始值(Primitive value),例如:string、number、boolean...
Hi~,我是 2020 届物联网专业毕业生,现就读于杭州。谨以此文来记录我的秋招以及入门前端以来的学习历程,如有错误,希望大家能及时提出!
在上一年,黑暗模式的概念席卷而来,随着系统级别的支持,其他主流应用程序的适配也陆续展开,它们大多提供了相应的入口,让用户可以切换整个主题,以此获得最舒适的体验。
最近在看 Lodash 的源码,其精简的语法和巧妙的设计,值得大家去细品 。其中有一个工具函数叫 getTag,旨在获取对象的类型标记(Tag),即我们所熟知的,利用 Object.prototype.toString.call() 去做类型检测。
Redis 是一个基于内存的键值数据库,它由 C 语言实现的,与 Nginx / NodeJS 工作原理近似,同样以单线程异步的方式工作,先读写内存再异步同步到磁盘,读写速度上比 MongoDB 有巨大的提升。
坐标杭州,我在上半年陆续找过一些前端实习,记录面经于此,供大家分享,现正在准备秋招。
此文用来记录 ES6 的核心特性,以及一些容易被遗落的知识点。
很多人都已经看过 Session 和 Cookie 相关的入门文章,却只限于纸上谈兵,不懂得实际运用,本文从最小项目入手,结合前端跨域、HTTP 等知识点,做一次深入实践。
本项目以功能清晰的 TodoList 为切入点,结合 React 全家桶、AntD 打造代码健壮性强,用户界面简洁的前端应用,以 Koa2 + MongoDB 为核心构建可维护性高的后端服务。