(译)CSS 是魔法, 是时候试试 3D 了

原文地址:CSS is magic, its time you try 3D 原文作者:Ankita Chakraborty 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2021/css-is-magic-its-time-you-try-3d.md 译者:tong-h 校对者:Chorer PassionPenguin CSS 是魔法, 是时候试试 3D 了 CSS transform 是 css 最全能,最神奇的属性之一。它不仅是在你的网站上实现平滑动画的最佳方式,更是你创造奇迹的一种方式。比如这个 🙀 — 我先为这几个占了你的网络宽带的动图道歉,但我希望它是值得的!🤜🤛 等下,这个立方体的两个面不见了!!! 我是故意这么做的,这样就会更形象,也更容易理解。我会...

51.5k2021-07-28
(译)用于 JavaScript 应用的前 5 大嵌入式数据库

原文地址:Top 5 Embedded Databases for JavaScript Applications 原文作者:Fernando Doglio 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2021/top-5-embedded-databases-for-javascript-applications.md 译者:tong-h 校对者:finalwhy PassionPenguin 用于 JavaScript 应用的前 5 大嵌入式数据库 我们习惯于将数据库视为一个大型的存储平台,我们把我们需要的所有数据都丢进去,然后再通过使用一些查询语言检索它们。扩展这些数据库,保持信息的一致性以及容错性本身就是一个挑战。那么,当我们数据需求量非常少的时候会发生什么? 当 Re...

103.1k2021-07-13
(译)面向具有 React 开发经验的开发者介绍 Svelte

原文地址:Svelte for the Experienced React Dev 原文作者:Adam Rackis 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2021/svelte-for-the-experienced-react-dev.md 译者:tong-h 校对者:liyaxuanliyaxuan、CarlosChenN、霜羽 Hoarfroster 面向具有 React 开发经验的开发者介绍 Svelte这篇文章将从富有 React 开发经验的开发者的角度快速的介绍 Sevlte。首先我会做一个概览,然后重点关注 state 管理和 DOM 交互能力等等。我打算把进度加快一点,这样就能覆盖更多的话题。总之,希望能引起你对 Svelte 的兴趣。 关于对 Svel...

184.5k2021-07-06
(译)一个编译成 JavaScript 接口框架的案例

原文地址:A Case for Compile to JavaScript Interface Frameworks 原文作者:AsyncBanana 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2021/a-case-for-compile-to-javascript-interface-frameworks.md 译者:tong-h 校对者:KimYangOfCat PassionPenguin 一个编译成 JavaScript 接口框架的案例 如今的 web 框架,类似 React 和 Vue 在创建现代 web 应用方面非常受欢迎,这是有原因的。这些框架帮助把代码片段变成可复用的组件,通过使用声明式性的标记使组件易于根据数据更新。 但几乎所有的这类框架运行时都需要重量型...

61.9k2021-06-17
(译)提高 Firefox 在 Linux 上的稳定性

原文地址:Improving Firefox stability on Linux – Mozilla Hacks - the Web developer blog 原文作者:Gabriele Svelto 译文出自:掘金翻译计划 本文永久链接:https://github.com/xitu/gold-miner/blob/master/article/2021/improving-firefox-stability-on-linux.md 译者:tong-h 校对者: Kimhooo PingHGao 提高 Firefox 在 Linux 上的稳定性大约一年前在 Mozilla, 我们开始努力提升 Firefox 在 Linux 上的稳定性。这个努力很快转变成 FOSS(Free and open source software, 自由及开放源代码软件) 项目之间的一个良好协...

82.4k2021-05-29
canvas绘制dom计算分页自定义打印

原生打印香吗?当然香啊,window.print() 页头页尾页码统统有,还能用 @media print 设置打印样式,没什么问题,棒棒的舒舒服服的;但是(没有但是也没这篇文章了🙃🙃🙃)分享分享一些我踩到的坑,以及我的解决方案 在打印页面加粗的字体的显示现在字体大部分都用苹方,微软雅黑之类的,好看又百搭,但是偶尔也会有UI要求或者其他原因引起的特殊需求需要其他字体,就会惊喜的发现明明设置了 css,页面显示出来的也是font-weight: bold 的效果,但是在打印下却还是和 font-weight: normal 一样。 我用的是宋体,如果你和我一样 1.字体是动态 2.需要加粗 3.这个字体没有加粗的版本 4.还需要打印可以试试我的替代方案: 1. 更换字体在 @media print 为需要加粗的文字更换其他字体,缺点就是因为不是配套的字体可能会不协调,而且文字如果...

92.1k2021-03-15
实现自定义滚动条 ScrollBar

写在前面原生的滚动条很强大,但是各个浏览器对于滚动条开放的 api 不同,google 是相当有好的,样式几乎都可以修改,But IE 就只能修改颜色,然而只改一个颜色不够啊,还是那么粗那么生硬为了保证样式的统一,就得自定义一个滚动条,如果你也想写或者你正在写但是卡在了某个地方,那就看看我踩过的坑吧 效果 实现思路首先需要实现这几个功能 *搭建好基本 DOM 框架*计算滑块高度和位置*当鼠标滚轮滑动,页面同步滚动*鼠标左键点击可以实现拖动*当 DOM 发生变化,更新滚动条位置和长度 搭建好基本 DOM 框架首先你得要有一个横向和一个纵向的滚动条出现在目标元素的右边和底部这是生成的基本的框架,ScrollBar 是目标元素,containerY 和 containerX 分别是纵向和横向的滚动条,wrapper 主要是为了滚动条定位也为了不去污染原本的 html 结构 1234567...

92.5k2019-08-15
js 拾遗:连续赋值 && for 循环顺序对性能的影响

连续赋值在掘金看到一段很有意思的 js 代码 12345var a = {n: 1}var b = aa.x = a = {n: 2}a // ?b // ? *1、a,b指向 {n:1} 内存一*2、a.x 可以看出 内存一.x ,内存一的值被修改为是{n: 1, x: {…}},内存一.x 值被指向 a*3、a 重新赋值执向 {n:2} 内存二*4、若再修改内存二的属性 那么也同时修改 b.x 的值 12a // {n: 2}b // {n: 1, x: {…}} https://stackoverflow.com/questions/38008672/how-does-a-x-a-n-b-work-in-javascripthttps://juejin.im/pin/5d49...

13372019-08-09
hexo 接入 github issue 评论

更新,评论系统切换为 gitalkgitment 登录 alert 报错 [object ProgressEvent],打开 network 这个 gh-oauth.imsun.net 请求失败,https://imsun.github.io/gitment/dist/gitment.browser.js 内向网址 https://gh-oauth.imsun.net 发送了验证请求,这个gh-oauth.imsun.net是作者自行搭建的,现在不在维护了,所以出现了问题 看了 gitment 的 issue 很多人都反应有问题,官方的 demo 也不能用 所以现在切换为 gitalk,方法差不多,只需要改下类名就好 1234567891011121314151617181920212223#comment #gitalk-container(data-gitalk=JSON....

48532019-08-06
hexo 主题制作

背景介绍hexo 是一个免费简单的博客框架,有很多好看开源主题,但是当你看到别人的博客和你自己的博客一模一样的时候,还是有点奇怪,熟悉又陌生的感觉 Hexo 内建 Swig 模板引擎,但是可以另外安装插件来获得 EJS、Haml 或 Jade 支持,Hexo 根据模板文件的扩展名来决定所使用的模板引擎,例如:layout.ejs,layout.swig 我有尝试过用 Swig,毕竟不需要安装插件,但是用过之后还是果断换回了 Pug(原 jade ),如果你两种模板引擎都没接触过那推荐你用 Swig,上手简单会快些,但如果你也是 Pug 的忠实粉丝,那么还是安装插件吧 你需要安装 2 个插件,渲染 jade 页面的插件和热更新的插件,并保存在 packagejson devDependencies 是开发时需要的插件 1npm install hexo-server hexo-brow...

38832019-08-05