栗子前端技术周刊第15期 - Taro 4.0 Beta、Bun Shell、Deno 1.40...

🌰栗子前端技术周刊第 15期 (2024.1.22 - 2024.1.28):浏览前端一周最新消息,学习国内外优秀文章视频,让我们保持对前端的好奇心。

📰 技术资讯

  1. Taro 4.0 Beta:Taro 4.0 的 Beta 版本已经发布,为了庆祝这一重要里程碑,凹凸实验室将在 1 月 31 日通过线上直播与开发者分享和交流。

  2. Bun Shell:使用 Bun Shell 更好地编写 JavaScript Shell 脚本 - 注重性能的服务器端运行时 Bun 将继续快速发展,通过使 Shell 脚本编写变得更简单、跨平台友好和不那么冗长,向 Shell 脚本的世界进军。

js 复制代码
import { $ } from "bun";

// to stdout:
await $`ls *.js`;

// to string:
const text = await $`ls *.js`.text();
  1. Deno 1.40:Deno 刚刚发布了 v1.40,其中引入了 Temporal API,使日期和时间操作更加简便。
js 复制代码
const birthday = Temporal.PlainMonthDay.from("12-15");
const birthdayIn2030 = birthday.toPlainDate({ year: 2030 });
console.log(birthdayIn2030.toString());
// 2030-12-15

console.log("day of week", birthdayIn2030.dayOfWeek);
// day of week 7
  1. Next.js 14.1:Next.js 14.1 更新内容中包括并行和拦截路由改进、Turbopack 改进以及 next/image 改进。

📒 技术文章

  1. Learn the :has() Selector by Example:文章介绍有关如何使用该选择器的五个实用示例。
js 复制代码
button:has(.icon) {
    display: flex;
    gap: 10px;
}
  1. 12 Modern CSS One-Line Upgrades:这里有十几种非常值得了解的 CSS 属性,这些单行升级将有助于减少技术债务,删除不必要的 JavaScript 行,还能轻松提升用户体验。比如 object-fit, scroll-margin, accent-color 等等。

  2. 真的不考虑下grid布局?有时候真的很方便!:flex 布局大家应该已经运用的炉火纯青了,有些场景下 grid 布局能更快完成任务。

  3. 你还在使用websocket实现实时消息推送吗?:文章主要介绍 SSE 的使用场景和如何使用 SSE。SSE 是一个单向通讯的协议也是一个长链接,它只能支持服务端主动向客户端推送数据,但是无法让客户端向服务端推送消息。优势在于复杂度就没有那么高,相对于客户端的消耗也比较少。

🔧 开发工具

  1. react-use: 实用 Hook 大合集 - 内容丰富,从跟踪电池状态和地理位置,到设置收藏夹、防抖和播放视频,无所不包。
  1. sparkly-text:让文字闪闪发光的小型 Web 组件 - 在文字底下使用 SVG 动画的可爱效果。
  1. Wooden Toggles:木质感按钮示例。

🚀🚀🚀 以上资讯文章选自常见周刊,如 JavaScript Weekly 等,周刊内容也会不断优化改进,希望你们能够喜欢 💖

相关推荐
勇敢di牛牛1 分钟前
Vue+mockjs+Axios 案例实践
前端·javascript·vue.js
詩句☾⋆᭄南笙11 分钟前
HTML列表、表格和表单
服务器·前端·html·表格·列表·表单
IT_陈寒24 分钟前
Python性能翻倍的5个冷门技巧:从GIL逃逸到内存视图的实战优化指南
前端·人工智能·后端
南城巷陌28 分钟前
错误边界:用componentDidCatch筑起React崩溃防火墙
前端·react.js·前端框架
FinClip34 分钟前
OpenAI推出Apps SDK,你的企业App跟上了吗?
前端·app·openai
馨谙39 分钟前
Linux中的管道与重定向:深入理解两者的本质区别
前端·chrome
Rhys..44 分钟前
JS - npm init
开发语言·javascript·npm
夏天想1 小时前
复制了一个vue的项目然后再这个基础上修改。可是通过npm run dev运行之前的老项目,发现运行的竟然是拷贝后的项目。为什么会这样?
前端·vue.js·npm
@大迁世界1 小时前
这个 CSS 特性,可能终结样式冲突
前端·css
zwjapple1 小时前
css变量的使用。
css