记录－交流－Web开发知识分享
现代 Android 智能手机依赖于大量服务，从应用商店和日历到消息传递和推送通知。他们中的大多数都有开放的替代方案，但直到现在，推送通知的唯一选择是 Google 的专有服务，Firebase Cloud Messaging (FCM)。 UnifiedPush 是一种新的替代方案，它允许您在不依赖于单个公司的情况下获得推送通知。
推送通知对于现代移动体验至关重要，因为它们允许应用与用户实时通信，即使未在主动使用时。依赖 Google 提供的推送通知导致了对隐私和独立性的担忧。专有的 FCM 库不能包含在 F-Droid 应用中，并且依赖于 Google 服务。因此，通常会看到 FOSS 应用采用应用和服务器之间的持久直接连接作为替代方案。…
作为 Web 开发人员，您可能已经注意到某些 API 仅在最终用户单击或点击 HTML 元素时才起作用。例如，如果您尝试在 Safari 的 Web Inspector 中运行以下代码，则会导致错误：…
早在去年 12 月，我们就写了一篇文章，详细介绍了 CSS 嵌套的三种不同选择。在其中，我们解释了选项 3、选项 4 和选项 5 之间的区别，并通过一系列示例演示了每个选项的工作原理。然后我们问了一个简单的问题：“哪个选项最适合 CSS 的未来？”
Web 开发人员非常清楚地回应了民意调查。选项 3 以压倒性优势获胜。
所以现在，Safari 和 Chrome 都实现了选项 3。两周前，也就是 1 月 25 日，CSS Nesting在Safari Technology Preview 162中默认启用。如果您有 Mac，只需下载并打开 …
我正在开发一个在浏览器中运行的流程图编辑器，我想要一种方法让人们无需登录或在我们的服务器上存储任何数据即可使用它。我想让他们控制自己的数据，并能够将其存储在本地以便稍后打开和编辑。并且还可以轻松地与其他人分享。通过支持文件上传/下载很容易做到这一点，但我想要更简单的东西，比如通过发送 url 进行共享的能力。我也不想在后端存储任何东西（至少对于免费层）。…
-webkit-text-size-adjust的用法如下：
1、之前可以设置一个百分比然后可以在网页上（pc）显示小于12px的字体，但后来谷歌新版本已经不支持这个属性了。如果还想实现小于12px的字体，要用-webkit-transform:scale(0.8)
2、在移动设备上如手机和平板横屏会导致字体变大，-webkit-text-size-adjust: 100%可以禁止字体变化。
3、-webkit-text-size-adjust放在body上会导致页面缩放失效
4、body会继承定义在html的样式
5、用-webkit-text-size-adjust不要定义成可继承的或全局的
…
在此示例中，我们将创建一个可排序列表，其项目可以在其中拖放：…
在查看此示例之前，建议访问此帖子以了解我们如何在列表中拖放元素。
现在我们可以使用相同的技术应用于表格行。基本思想是
在 Twitter 上根据Manuel Matuzović 最近的一篇文章进行了热烈的讨论之后，我认为值得在这里写一些简短的想法。今天，我们快速浏览一下该<template>元素以及它如何派上用场。
所以简单来说，<template>HTML元素就是用来存放还没有被使用的HTML的。元素本身及其所有内容都是不可见的，因此它基本上可以出现在文档中的任何位置而没有太大风险。尽管您通常会在根级别拥有模板。…
PagerDuty 早上很早就出发了，我们的英雄诅咒自己倒霉并接到了电话。他让 PagerDuty 将消息重复两次，但无法理解消息。他按下号码以确认这件事。他打开 MacBook，发现来自 PagerDuty 机器人的 slack 消息信息量更大。他单击了链接，然后将他带到了 Grafana 仪表板。
他盯着红色的心形图标看了几秒，其中一个微服务故障率很高。有一秒钟，他很想更新错误阈值，这样他就可以回去睡觉了。勉强地，他打开 Graylog 并查看日志，注意到 401 响应。他在日志中查找更多信息，但没有找到有用的信息。…
这个问题实际上可以用数组扩展运算符轻松解决。
let elements = document.querySelectorAll('button');
elements = [...elements];
console.log(elements) // Before reverse
elements = elements.reverse(); // Now the reverse function will work
console.log(elements) // After reverse<html>
<body>
<button>button1</button>
<button>button2</button>
<button>button3</button>
<button>button4</button>
<button>button5</button>
</body>
</html>…
近期评论