EP30 Server Action 是有点儿搞笑，但前端得学

AsyncTalk

Player FM - Internet Radio Done Right

Đã thêm cách đây ba năm

Nội dung được cung cấp bởi AsyncTalk. Tất cả nội dung podcast bao gồm các tập, đồ họa và mô tả podcast đều được AsyncTalk hoặc đối tác nền tảng podcast của họ tải lên và cung cấp trực tiếp. Nếu bạn cho rằng ai đó đang sử dụng tác phẩm có bản quyền của bạn mà không có sự cho phép của bạn, bạn có thể làm theo quy trình được nêu ở đây https://vi.player.fm/legal.

cách đây khoảng một năm trước 14:56

M4A•Trang chủ episode

本期节目主要以 next.js 的 Server component 和 Server action 为主题聊了一些 @AnnatarHe 自己的看法。

总得来说，next.js 这波做得有点儿过了，但是也是发展的大方向。嘲笑之余，还是得学学。

主播

AnnatarHe: https://annatarhe.com

Timeline

00:18 next.js 与 use php

01:05 React 最近最大的变化是 Server Component

02:00 前端多年来的进化 - 复杂是不可避免的

03:06 之前的 SSR 只是为了 SEO, 新的 Server Component 并不一样

04:30 更为极端的 Server Action 也来了

06:16 Server Action 在嘲笑之余，是有很严肃的场景 —— 长期看好

08:10 只是目前的版本大概还略带搞笑 —— 安全的代码很难写，学习曲线更为陡峭

09:50 next.js 的 bug 率可能比我的还高。

10:30 自己的项目升级了 14，不出所料地挂了

11:20 大部分工具库并不支持完整版的 Server Component —— Steaming

EP30 Server Action 是有点儿搞笑，但前端得学

AsyncTalk

published cách đây khoảng một năm trước

Chia sẻ

M4A•Trang chủ episode

本期节目主要以 next.js 的 Server component 和 Server action 为主题聊了一些 @AnnatarHe 自己的看法。

总得来说，next.js 这波做得有点儿过了，但是也是发展的大方向。嘲笑之余，还是得学学。

主播

AnnatarHe: https://annatarhe.com

Timeline

00:18 next.js 与 use php

01:05 React 最近最大的变化是 Server Component

02:00 前端多年来的进化 - 复杂是不可避免的

03:06 之前的 SSR 只是为了 SEO, 新的 Server Component 并不一样

04:30 更为极端的 Server Action 也来了

06:16 Server Action 在嘲笑之余，是有很严肃的场景 —— 长期看好

08:10 只是目前的版本大概还略带搞笑 —— 安全的代码很难写，学习曲线更为陡峭

09:50 next.js 的 bug 率可能比我的还高。

10:30 自己的项目升级了 14，不出所料地挂了

11:20 大部分工具库并不支持完整版的 Server Component —— Steaming

Tất cả các tập

1
EP44 AI 在卷编辑器了 56:56

cách đây 7 weeks trước56:56

56:56

AI 发展太快了，产品出得也挺给力。那么 AI 产品有什么方向吗？编辑器是不是正在进行的新风口？如果你有什么新点子，不嫌弃的话也可以评论区留言，或许有人会有更优化的点子助力也说不定呢？音量问题本期节目已尽量调大，但是可能还是不满足要求，请用户再自行加大音量。（其实我不会用剪辑软件）如果有什么意见建议欢迎发送邮件到 async.talk@gmail.com 或者在 X(Twitter) 上与我们互动 https://x.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Louis: https://x.com/louistang151 Timeline 00:46 AI 发展太快了 05:06 Deepseek 的影响挺大 07:44 聊天 → RAG → Agent 14:55 Agent 做代码编辑器好像挺靠谱 17:45 新的代码编辑器应该是什么样子 26:45 Cursor 这种代码编辑器收费如此高昂，但是能挣钱吗？ 31:02 AI 编辑器应该有什么新功能会是全功能团队吗？ 42:02 为什么这种划时代的产品没有在大公司出现？ 45:33 使用 AI Editor 有哪些 tips 吗？ 50:55 Agent 新方向？ 54:51 思想开源挺重要相关链接 Introducing ChatGPT: https://openai.com/index/chatgpt/ GPT-4 is OpenAI’s most advanced system, producing safer and more useful responses: ****https://openai.com/index/gpt-4/ OpenAI o3-mini**:** https://openai.com/index/openai-o3-mini/ Deepseek: https://www.deepseek.com/ Transcript for DeepSeek, China, OpenAI, NVIDIA, xAI, TSMC, Stargate, and AI Megaclusters | Lex Fridman Podcast #459: https://lexfridman.com/deepseek-dylan-patel-nathan-lambert-transcript/ RAG: https://blogs.nvidia.com/blog/what-is-retrieval-augmented-generation/ LLM Agents: https://www.promptingguide.ai/research/llm-agents Cursor: The AI Code Editor**:** https://www.cursor.com/ Windsurf: https://codeium.com/refer?referral_code=3bfa98e9cc Trae: https://www.trae.ai/ V0: https://v0.dev/ Bolt: https://bolt.new/ Zed editor: https://zed.dev/ Three.js: https://threejs.org/ Devin AI: https://devin.ai/ TablePlus 管理数据库: https://tableplus.com/ Sonnet 3.7: https://www.anthropic.com/claude/sonnet 在 Gmail 中使用智能撰写功能: https://support.google.com/mail/answer/9116836?hl=zh-Hans&co=GENIE.Platform%3DDesktop Cursor Notepad: https://docs.cursor.com/beta/notepads 扩展阅读 Introducing the Model Context Protocol: https://www.anthropic.com/news/model-context-protocol Building effective agents**:** https://www.anthropic.com/engineering/building-effective-agents Anthropic thinks you should build agents like this**:** https://www.aihero.dev/building-effective-agents 花了大半个月，我终于逆向分析了Github Copilot**:** https://github.com/mengjian-github/copilot-analysis…

1
EP43 成人话题 - 大厂生活（生存）指导音频 1:06:05

cách đây 16 weeks trước1:06:05

1:06:05

本期节目从油腻的中年男人的自我辩解开始，探讨了如何挣钱，如何做自己的项目一直到大厂的生活。当然也是分享了一些在大厂生存的小技巧。如果听众朋友有考虑做一做副业，也欢迎大家一起做播客和我们来卷一卷 � 有任何意见建议欢迎在评论区留言，发邮件至 async.talk@gmail.com 也可以关注 X(twitter): https://x.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Louis: https://x.com/louistang151 Timeline 01:00 刚毕业的状态 04:20 油腻中年男人的自我辩解 08:05 挣钱的路子：打工，投资，黑产，副业 17:27 Selling 也非常重要 21:50 个人与职业的成长路径，以及成本 25:46 大厂的集体意志: 他人评价并不等于真实反馈。而绩效把人变得平庸 29:57 保护自己，不能 all in 大厂 34:41 如何在菜场买肉 39:50 离了大厂，还能做点儿什么 42:20 大厂的小招数可能对老外不是很好用 44:44 会是 AI 送我们毕业吗？ 48:48 如何在大厂生存 64:40 保留自己的想法，找到自己的兴趣。早日赎身。相关链接 Roc: https://x.com/roczhang9673 Lok: iPad 也能有桌面: https://apps.apple.com/us/app/lok-board/id1621242252 EP19 上班也就图一乐，真挣钱还得卖 App （吗？） https://asynctalk.com/posts/ep19 孙哥的香蕉: https://x.com/justinsuntron/status/1865831394146140547 Kimi 助手: https://kimi.moonshot.cn/ 豆包 AI 助手: https://www.doubao.com/chat/ Bolt: https://bolt.new/ v0: https://v0.dev/ 稚晖君: https://space.bilibili.com/20259914/ stormzhang: https://github.com/stormzhang Evan You: https://github.com/yyx990803…

1
EP42 是升级 Node 还是换用 Deno? 17:26

cách đây 27 weeks trước17:26

17:26

RTE 大会将在 25， 26 号在北京举行，包含了众多音视频和前沿 AI 的内容，关键这么好的活动还免费。欢迎大家来参加呀： https://www.bagevent.com/event/sales/qlyy24ejnpq8qd31qk7se84msx4zzjv4 本期节目借着 Deno 2 的发布，又来聊了 Node.js 的发展变迁。js 社区的折腾是有意义的，它带来不断的新变化，新机遇。一成不变，最为无聊。 Deno 2 还是很有趣的，各位可以试试看 � 内容中如果有任何不正确，或者你有自己的意见建议，欢迎留言或者在 twitter 中沟通: https://x.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Timeline 00:20 RTE 大会贼牛逼，25， 26 号来北京参加一下吧～ 01:28 自己一个事业比打工爽多了 02:55 很多时候一个事业来源于愤怒的想法 03:45 Node.js, io.js 与 deno 的分分合合 07:00 稳定的东西很无趣，变化才有机会 08:55 Deno 的发展是一步步的妥协与成长 14:25 Deno Deploy 14:43 我自己会不会用 Node/Deno 相关链接 Node.js: The Documentary | An origin story https://youtu.be/LB8KwiiUGy0?si=vssFbRqJgWIFi7Sd Node.js 中关于 io.js 的部分: https://en.wikipedia.org/wiki/Node.js#:~:text=In December 2014%2C Fedor Indutny,including the updating of io. Node.js Releases: https://nodejs.org/en/about/previous-releases Node.js Pull Request: module: add --experimental-strip-types https://github.com/nodejs/node/pull/53725 关于 js 社区变化大的一条 twitte: https://x.com/AnnatarHe/status/1846757992492159210 Announcing Deno 2 https://deno.com/blog/v2.0 Deno Deploy: https://deno.com/deploy Deno compile: https://docs.deno.com/runtime/reference/cli/compiler/ 扩展阅读 Bash/Sh is an objectively awful programming language: https://news.ycombinator.com/item?id=35992575…

1
EP41 前端的天命就是做表单 16:55

cách đây 29 weeks trước16:55

16:55

AI 发展很猛，可是我们前端却不怕失业。因为我们有表单可以做。 hhhhhh 快来听听新一期的播客吧，主播 AnnatarHe: https://annatarhe.com Timeline 00:53 AI 发展太快了。前端是不是要丢工作？ 03:33 做表单是 web 开发的安全区 04:20 内容大，多级联动，业务复杂是表单不被 AI 取代的原因 06:20 技术实现上，表单也不好做：代码设计不好搞 09:02 表单校验很重要 11:10 校验国际化还是非常重要的 12:38 标准化与合规也是设计表单的一部分 15:38 做表单不仅要快，更要做好相关链接 https://claude.ai/ gpt-4o: https://openai.com/index/hello-gpt-4o/ https://www.adobe.com/products/dreamweaver.html https://en.wikipedia.org/wiki/Microsoft_FrontPage EP06 Low Code 到底 Low 不 Low: https://asynctalk.com/posts/ep6 EP10 出海，国际化: https://asynctalk.com/posts/ep10 Antd.Form: https://ant.design/components/form-cn react-hook-form: https://react-hook-form.com/ BGM by Otologic…

1
EP40 状态机自古以来是前端领域不可分割的一部分 15:42

cách đây 38 weeks trước15:42

15:42

状态机自古以来就是前端领域不可分割的一部分。本期节目从状态机开始，讨论了一些开发经验 —— 包括不能走极端框架信仰，同步不一定万恶，状态机不可分割。之后用一个例子介绍了如何用流程和状态管理来进行业务设计。最后，前端的天花板不一定像是外界说得那么低（有没有可能，低是因为视野低？）主播 AnnatarHe: https://annatarhe.com Timeline 00:07 比较懒，所以更新慢 03:40 因为巨大的项目，所以想起了状态机 01:58 不要定式思维框架 04:21 设计模式确实很有道理，得学，得用 05:30 复杂状态下，考虑一下，接上状态机 08:20 同步并不是纯粹的坏事，也不应该完全拒绝 09:48 状态机可以有效降低维护成本 10:12 例子：和机器人聊天的状态与逻辑设计 14:14 不要定式思维，不要接到需求就开干 14:50 前端的天花板，也许没有外界说得那么低相关链接 XState: https://stately.ai/docs State and Lifecycle: https://legacy.reactjs.org/docs/state-and-lifecycle.html 扩展阅读 Improving State Management with Xstate: Refactoring Authorization Flows: https://annatarhe.github.io/2024/08/04/improving-state-management-with-xstate-refactoring-authorization-flows.html…

1
EP39 Server Rendering 升职加薪的好路子 19:07

cách đây 42 weeks trước19:07

19:07

本期节目从前端性能优化开始，主要还是关于 SSR, RSC 和 Node 如何提升渲染性能。目前这条路径看起来应该是个比较确定的 Web 发展方向了。大家可以考虑追上节奏，升职加薪欢迎评论区留言, 给我们发邮件 async.talk@gmail.com 或者在 Twitter 留言: https://twitter.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Timeline 00:28 从前端性能优化开始 02:00 传统的前端性能优化在 Server rendering 面前略显尴尬 03:10 后端渲染和 RSC 很不同 07:20 后端渲染的网络天生比客户端快 10:59 大项目可以考虑自己实现 Server rendering 11:30 API Server 的两种设计方式 14:50 Node 躲不开，得学习 15:21 Node 几个有趣的学习点 18:20 后端是个很好的学习入口相关链接 HTTP2: https://en.wikipedia.org/wiki/HTTP/2 DNS Prefetch: https://developer.mozilla.org/en-US/docs/Web/Performance/dns-prefetch Preload: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload React Server Component: https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components Partial Prerendering: https://nextjs.org/docs/app/api-reference/next-config-js/partial-prerendering BigPipe: https://engineering.fb.com/2010/06/04/web/bigpipe-pipelining-web-pages-for-high-performance/ Spring: https://spring.io/ MVC: https://en.wikipedia.org/wiki/Model–view–controller CGI: https://en.wikipedia.org/wiki/Common_Gateway_Interface BGM by Otologic…

1
EP38 「前端輕鬆聊」联动 - 候选人只要拿到 Offer 就可以了，而面试就要考虑很多了 36:11

cách đây 46 weeks trước36:11

36:11

最近工作不容易啊，来和前端輕鬆聊的 Eric 一起聊聊在北美的工作情况。有任何意见，建议或者评论欢迎在下面评论或者发邮件至 async.talk@gmail.com 本期剪辑是分开的，也可以去听 Eric 的版本: https://fetalk.dev/episodes/ep34 主播 AnnatarHe: https://annatarhe.com Eric 前端輕鬆聊 : https://fetalk.dev/ Timeline 00:02 欢迎 AsyncTalk 的 AnnatarHe 与前端輕鬆聊的 Eric 00:46 北美与中国的面试大概要多久？ 04:45 北美面试流程长吗？ 08:30 北美招聘市场似乎有回暖 10:30 有趣的面试经历 16:35 变成面试官什么感觉？ 17:19 作为面试官，能否合作也许是最重要的 19:50 礼貌是面试者和面试官都需要具备的东西 20:05 面试时双向的，没有谁高谁低 21:42 面试官不要找优越感，找优点 22:46 有题库的面试官，本来就不公平 24:09 别谦虚 26:00 加拿大应届生大概 8 万 CAD ? 30:00 级别越高，股票越多？ 31:50 Eric 的神仙面试 33:00 跟人合作也许比业务重要 BGM by Otologic…

1
EP37 在？听说你也在卷编辑器？ 25:10

cách đây 49 weeks trước25:10

25:10

或许是 AI 的发展，文本编辑迎来了又一个春天。从最原始的 Textarea 到一站式的富文本编辑器，再到最近崛起的 Headless framework，文本编辑正在不停迭代在 AI 的加持下，文本编辑会不会是一个新的窗口？如果自己做一个文本编辑器，如何做技术选型？应该做哪些功能呢？来听一听今天 AsyncTalk 吧～欢迎评论区留言, 给我们发邮件 async.talk@gmail.com 或者在 X 留言: https://twitter.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Timeline 00:30 AI 时代，文本编辑发展很快 02:40 文本编辑器卷得非常厉害 04:05 Word/WPS 早期发展，专业领域依旧强大 04:40 Evernote 简单和云服务也许是它当年的优势 05:20 Markdown 正在吞噬传统文本编辑 07:30 自己造编辑器变得有可能了 08:40 云的链接也许是 notion 和 lark 强大的原因 09:50 jupyter notebook 很不一样 10:41 AI 的革新非常迅速 11:20 如何做一个 Web 文本编辑器？Textarea 与 framework 12:20 整套的文本编辑方案正在向 Headless 转变 13:58 TipTap 与 Lexical 18:06 文本编辑的协作，AI 和报表功能不可或缺 22:22 Local first 真的那么重要吗？ 24:20 听众也可以卷文本编辑器，赶上这波 AI 与协作的浪潮相关链接 Playwright 的 VSCode 拓展，展示了 block 粒度的编辑控制: https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright 印象笔记(Evernote): https://evernote.com/ 飞书(Lark): https://www.larksuite.com/ Jupyter notebook: https://jupyter.org/ TipTap Editor: https://tiptap.dev/product/editor Lexical Editor: https://lexical.dev/ 扩展阅读 Observable Framework 这个产品看起来非常不错，推荐一把: https://observablehq.com/ BGM by Otologic…

1
EP36 我们总会毕业 26:08

cách đây 1 year trước26:08

26:08

Shownotes AsyncTalk EP36 来谈论最近很沉重的工作话题。因为 AnnatarHe 最近有些朋友的职业有一些变化，包括网上的一些评论和态度觉得有必要聊一聊。这一期主要是谈论了裁员降薪的背景原因，面试没过十分正常。记得要用闲暇时间放松一下，拓展视野。也不要对互联网沮丧，这依旧是个容量和潜力极为巨大的行业。在公司的话，记得多跟人沟通交流，学习一些自己不会的东西，也要有自己的品味，最重要的，做个好人。祝大家过得开心，熬过这段周期。欢迎评论区留言, 给我们发邮件 async.talk@gmail.com 或者在 X 留言: https://twitter.com/AsyncTalk 主播 AnnatarHe: https://annatarhe.com Timeline 00:16 谢谢赞赏支持 @Retros回憶 @Asurada 00:45 EP34 的 JS Runtime 分类并不准确, Hermes 的原因也不一定正确 02:00 最近大家都很压抑，来聊聊 03:45 裁员降薪的原因多种多样。大家都很棒，别 PUA 自己 06:00 面试没过原因多种多样，别沮丧 06:41 面试官水平不一定比你高 09:54 休息，读书，拓展视野 13:13 AnnatarHe 没觉得互联网下行，基本盘依旧是巨大的影响力 15:00 CRUD 也不简单哦 —— 性能，开发者体验，选型，效率 16:41 前端玩得很花，也没那么无聊 17:32 还在打工就一定要白嫖公司 19:00 站不站队？好的工程师一定是有自己的品味的 22:58 记得做个好人 23:50 大佬也不安全，记得做自己的业务 24:52 别沮丧，一定的危机是好事儿相关链接 Carousell cuts 10% of total headcount, including about 50 job roles in S’pore: https://www.straitstimes.com/singapore/jobs/carousell-cuts-110-jobs-to-rein-in-costs Mark Zuckerberg’s Message to Meta Employees: https://about.fb.com/news/2022/11/mark-zuckerberg-layoff-message-to-employees/ The Node.js Event Loop: https://nodejs.org/en/learn/asynchronous-work/event-loop-timers-and-nexttick#event-loop-explained Tokio: https://docs.rs/tokio/latest/tokio/ BGM by Otologic…

1
EP35 让我看看博客和官网应该怎么写 20:35

cách đây 1 year trước20:35

20:35

让我猜猜，你是不是也想自己写个博客官网啥的？来听听这期节目试试有没有其他有趣的方案吧～感谢 Roy 的赞赏也记得要关注 twitter 哦: https://twitter.com/AsyncTalk 欢迎评论留言 async.talk@gmail.com 名词解释 DSL: 专用领域语言 Domain-Specific Languages ROI: 投资回报率 return on investment 主播 AnnatarHe: https://annatarhe.com Timeline 00:00 感谢 Roy 的赞赏！ 00:10 我们开通了 twitter: AsyncTalk 01:00 最近重写了遍官网，来聊一聊 02:02 官网和博客的特点：重 SEO, 低 ROI, 要面子, 高信息密度 04:20 技术选型: Gatsby, Astro 或者 Next.js 08:53 其他的技术选型？ 09:51 写文章？选 MDX 吧 11:09 OpenGraph 还是要做的 12:19 如何生成 OpenGraph 的图？satori + sharp 14:00 讨好爬虫的手段: HTML 标签, a11y, RSS 16:40 官网博客应该接入其他服务吗？RSS, 打点分析 17:08 图片优化 - blurhash 18:20 怎么部署（白嫖）? 相关链接 twitter 账户: https://twitter.com/AsyncTalk EP12 官网与 SEO: https://asynctalk.com/posts/ep12 WebWorker No.48 和 Astro Maintainer 瑞丰科普 Astro 使用心得、参与开源和成长感悟**:** https://podcast.webworker.tech/48 Gatsby - 曾经的 JAMStack 老大哥: https://github.com/gatsbyjs/gatsby Astro: https://astro.build/ NextJS: https://nextjs.org/ Gatsby 5 is dead? https://github.com/gatsbyjs/gatsby/issues/38859 Ruby on rails - 曾经的后端框架王者: https://rubyonrails.org/ Jekyll - 静态站点生成: https://jekyllrb.com/ MDX: https://mdxjs.com/ The Open Graph Protocol: https://ogp.me/ satori - JSX 转 SVG: https://github.com/vercel/satori sharp - JS 图像操作库: https://github.com/lovell/sharp React Testing library: https://testing-library.com/docs/guiding-principles Blurhash: https://blurha.sh/ Cloudflare Pages: https://pages.cloudflare.com/ Render.com: https://render.com/ Vercel: https://vercel.com/ DigitalOcean Apps: https://www.digitalocean.com/products/app-platform 扩展阅读 Domain-Specific Languages https://www.jetbrains.com/mps/concepts/domain-specific-languages/� 勘误 BGM by Otologic…

1
EP34 JS Runtime 怎么也卷起来了 22:02

cách đây 1 year trước22:02

22:02

Node.js, Deno, Bun, Hermes, LLRT。怎么这年头做 JS Runtime 也这么卷？本期节目介绍了几个 JS Runtime ，来听听看有没有你正在用的 Runtime 欢迎大家在评论区分享你对 JS Runtime 的看法，以及你正在使用或计划使用的 Runtime。主播 AnnatarHe: https://annatarhe.com Timeline 00:24 感谢 @辛宝-WebWorker 和 @烤箱的赞赏支持 01:18 AI 虽然很火，JS Runtime 也很卷 02:17 JS Runtime: Node, Deno, Bun, Hermes, LLRT 03:36 NodeJS 还是老大哥，但是已经成了背景板 04:26 Deno 策略激进, 有力竞争者 07:30 Deno 真正的竞争力: Edge Computing, Cloud, 工具链 09:10 Bun 高兼容，高性能 10:24 Hermes: 启动速度，React Native 专属 10:48 Hermes 真正的竞争力是和 Android Webview 对比出来的 11:50 LLRT: 启动速度和成本 12:38 被遗忘的 Alinode: debug 13:04 如何选择 Runtime 14:24 不同的 Runtime 有不同的注意事项: 语法，接口 16:04 自己做 Runtime 需要注意什么：商业化，云服务，性能，工具链，兼容性 20:08 Deno 的几个卖点可能并不够有吸引力相关链接 - NodeJS: https://nodejs.org/en - Deno: https://deno.com/ - Bun: https://bun.sh/ - Hermes: https://hermesengine.dev/ - LLRT: https://github.com/awslabs/llrt - The Future of the Web is on the Edge: https://deno.com/blog/the-future-of-web-is-on-the-edge - Deno vs Node.js: Performance comparison for file server: https://medium.com/deno-the-complete-reference/deno-vs-node-js-performance-comparison-for-file-server-9af26133c800 - Is Bun really much faster than Node.js? https://medium.com/deno-the-complete-reference/is-bun-really-much-faster-than-node-js-e5b15942a8e8 - X5 内核: https://x5.tencent.com/ - Alinode: https://cn.aliyun.com/product/nodejs?from_alibabacloud= - QuickJS Engine: https://bellard.org/quickjs/ BGM by Otologic…

1
EP33 这能搞钱吗？ —— 从新邮件到开发者服务 25:15

cách đây 1 year trước25:15

25:15

本期节目以最近更新的 react-email 作为引子，讨论了它的出现，功能以及发展方向。同时引申到项目的想法，融资，设计和营销等方面都困难重重，并不容易。最后探讨开发者服务也许是一片新蓝海。如果你对本期节目有任何建议和意见或者希望合作，欢迎发邮件至 async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:01 新出的 react-email 让开发邮件前端更简单 03:19 react-email 的 UX 做得非常棒 05:00 react-email 支持众多的 SDK 与 integration 06:38 react-email 有个平台，商业模型大概率是通过发邮件来收费 07:06 这个服务开发难度不高 08:16 但这个服务并不简单：这个想法不容易出，投资也很难拿 10:47 营销更是困难重重：高强度刷 twitter 也是一种工作 12:49 做不出这么酷产品的一大原因：设计的优先级极低 15:07 国内做大而全的产品，不会支持第三方服务的 15:53 开发者体验的优先级也极低 18:26 为何别人能做出 react-email 这样的项目：融资相对简单 19:51 为何别人能做出 react-email 这样的项目：自我牺牲的精神导致内部诉求低优先级 22:50 做开发者服务或许有些机会 23:01 工程师们收入相对不错，有付费意愿，且人数众多，越来越多相关链接 react-email: https://react.email/ react-email 文档: https://react.email/docs/introduction mjml: https://mjml.io/ fix(react-email): ESM Issue with await import of the compiled email templates: https://github.com/resend/react-email/pull/1214 野狗 - 云服务: https://www.zhihu.com/org/ye-gou-ke-ji/answers Leancloud: https://www.leancloud.cn/ MongoDB Database Skills (Sia Cheap Thrills Parody) : https://www.youtube.com/watch?v=0vPt7GI-2kc&ab_channel=MongoDB Zeno Rocha: https://twitter.com/zenorocha stripe: https://stripe.com…

1
EP32 npm run 1:20:46

cách đây 1 year trước1:20:46

1:20:46

注：本期非技术内容本期和 Philo 及 TK 两位组成了 SG-JP-CA 轴心就海外生活聊了聊天。从出去的原因，方式和目的地选择，到海外业务拓展，商业前景观察。内容很长，聊天蛮愉快。如果你对海外生活感兴趣，可以试着听一听。因为我们三个人呆的时间都不长，如果有什么不对的地方，欢迎评论或邮件留言 async.talk@gmail.com 今天的金句: 感觉活着的成分里面，生活比生存更多了一些 - TK 名词解释： SRE: Site Reliability Engineer GTA: The Greater Toronto Area 主播 AnnatarHe: https://annatarhe.com Philo TK Timeline 00:00 嘉宾介绍 01:15 Philo 是为了职业发展, AnnatarHe 出去打工去了, TK 则跑去看世界 05:00 世界这么大，是怎么选目的地的 12:40 多样性带来的文化冲击有点儿大 16:30 羡慕极了住在安大略湖旁的大 house 里的 Philo(而且还不贵) 24:38 TK 能买房安家落户吗？ 26:00 HDB 买得起，condo 得努努力，house 就别想了 27:20 AnnatarHe 通过中资公司的出海业务出去的 27:59 Philo 是创业项目 28:52 TK 日文好，工作随便找 35:23 读好文档，可以比中介还专业 37:40 3k USD === 3k CNY ? 38:45 房子便宜，白菜贵了 44:08 东京的生活成本可以比上海还低 ??? 47:50 月薪没 10w 人民币还是别来新加坡了 48:00 JP 难高薪，CA 税收高 49:40 高税收是 GOV 拿钱分配，低税收靠商业分给国民 50:20 东南亚市场潜力大，但是种族，宗教因素很难把控 52:15 CA 市场比较佛，熟人社会，流行负债 60:00 JP 内外分明，非常保守，难以开拓市场 66:20 合规成本不低，本地市场复杂 71:20 去做 JP 上云业务是不是有点儿搞头？ 73:01 CA 做程序员性价比不高 76:05 出来之后，发现生活可以不一样；上海的不满都解决了；天气不错，心情也好了，过非 NPC 的生活相关链接日本高度人才准证: https://www.mofa.go.jp/j_info/visit/visa/long/visa16.html 香港高端人才通行证: https://www.immd.gov.hk/eng/services/visas/TTPS.html…

1
SP03 杭州上海见 1:06

cách đây 1 year trước1:06

1:06

AsyncTalk 将在杭州和上海举行一场线下聊天（其实就是找个星巴克坐一俩小时）12 月 23 日下午 2 点，杭州城区；12 月 30 日下午 2 点，上海城区。每场活动上限 5 人，若少于 2 人则会取消，参与需要付费 7 元，学生 1 元。有意参与者发邮件到 async.talk@gmail.com 即可我们一定能复活，一定能彼此相见，高高兴兴、快快活活地互相讲述经过的事情 — 卡拉马佐夫兄弟陀思妥耶夫斯基

1
EP31 [WebWorker] OpenAI 和 Github 又有什么新活? 1:27:35

cách đây 1 year trước1:27:35

1:27:35

本期是 #2023 技术播客节的一期节目。主要是和 WebWorker 播客联动一起畅聊 AI, Copilot, Next.js 与跨端技术，内容较长但是也同样比较有趣。欢迎大家也一起听一听 WebWorker 的节目若有其他任何意见建议欢迎发邮件联络: async.talk@gmail.com 金句刚刚说 copilot这个事情，copilot 帮我们做的时候，是不是我的思维并没有什么价值— AnnatarHe 我日常工作 50% 是 Copilot 完成的ー开翼 12 月 4 日技术播客节节目单 @科技乱炖：37位程序员用GPT写代码的真相和AI职业焦虑 @Thoughtworks洞见： AIGC 对程序员的影响 @软件那些事儿：人工智能第一次会议：1956年达特茅斯会议 @OnBoard!：亲历硅谷的一二级投资思考 @开始连接LinkStart：用 AI 打造你的社交助手，两位 90 后创业者有话要说 @内核恐慌：编程的终结 @AsyncTalk：WebWorker 联动 - OpenAI 和 Github 又有什么新活? @代码不在服务区：前端向未来：AI时代，怎样成为顶尖的前端工程师？ @枫言枫语：科技快乐星球21: 大公司都在挤AI 主播 AnnatarHe: https://annatarhe.com WebWorker: https://podcast.webworker.tech/ 辛宝: https://twitter.com/ji3206 开翼: https://twitter.com/real_kai42 小白菜: https://twitter.com/cabbage00001 Timeline 00:30 OpenAI 发布会回顾 07:13 Prompt 管理和调试，可能也没那么容易 21:01 Copilot 卖你 $10 块钱有点儿便宜了 37:50 Next.js 新的 Server Component 影响有点儿大 55:59 小程序你到底行不行啊 63:28 老外也有超级 App 的 72:59 electron 该请个好公关 86:17 快乐戛然而止，下期再见扩展阅读技术播客节: https://podfest.tech/zh-CN PrompPal: https://github.com/PromptPal/PromptPal github copoilt chat 节目链接: https://www.xiaoyuzhoufm.com/episode/647f4c3b5ed4bd1a463abff3 如何用 Copilot 完整自己 50% 的工作: https://x.com/real_kai42/status/1728280569640018107 关于「2023 技术播客节」缘起于2022仲夏时节技术播客之间的梦幻联动，我们感受到了社区共创共建的力量。今年我们再接再厉，集结了30+播客、5大出品人、20+社区，希望拉动更多技术生态的内容创作者，一起用声音来表达，建设自家技术影响力，推动更高粘性、更深互联、更持久共鸣的用户社区构建。…

1
EP30 Server Action 是有点儿搞笑，但前端得学 14:56

cách đây 1 year trước14:56

14:56

本期节目主要以 next.js 的 Server component 和 Server action 为主题聊了一些 @AnnatarHe 自己的看法。总得来说，next.js 这波做得有点儿过了，但是也是发展的大方向。嘲笑之余，还是得学学。主播 AnnatarHe: https://annatarhe.com Timeline 00:18 next.js 与 use php 01:05 React 最近最大的变化是 Server Component 02:00 前端多年来的进化 - 复杂是不可避免的 03:06 之前的 SSR 只是为了 SEO, 新的 Server Component 并不一样 04:30 更为极端的 Server Action 也来了 06:16 Server Action 在嘲笑之余，是有很严肃的场景 —— 长期看好 08:10 只是目前的版本大概还略带搞笑 —— 安全的代码很难写，学习曲线更为陡峭 09:50 next.js 的 bug 率可能比我的还高。 10:30 自己的项目升级了 14，不出所料地挂了 11:20 大部分工具库并不支持完整版的 Server Component —— Steaming 相关链接 React Server Component: https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components Nextjs-use-php: https://github.com/bufferhead-code/nextjs-use-php Experimental streaming without prefetching in Next.js: https://tanstack.com/query/v5/docs/react/guides/advanced-ssr#experimental-streaming-without-prefetching-in-nextjs 勘误 use-shell 在 twitter 上看到的，没能找到当初的链接，请各位自行脑补 BGM by Otologic…

1
EP29 装上 Zod 没有 Bug 13:18

cách đây 2 years trước13:18

13:18

Shownotes 本期节目主要介绍了运行时的校验以及它的一个实现 —— Zod. 在越来越大的项目中，运行时校验是逃不开的一个环节，可以应用在表单校验，API 返回值校验和后端的参数校验中。如果你的项目多人协作但是还没有接入类似的功能，可以考虑加一下，降低一些 bug 率如果对节目有任何意见或者建议，欢迎联系 async.talk@gmail.com 名词解释 Runtime: 运行时，运行中的情况 CI: 持续集成，简而言之，build & test 放到独立的服务器去做 Lint: 代码校验，规范协作情况下代码统一主播 AnnatarHe: https://annatarhe.com Timeline 00:20 最近意识到 zod 蛮有趣的 00:50 大型项目协作的问题 02:30 Runtime 检查的必要性 03:20 Zod 的优势 04:30 应用场景 —— 表单校验 06:10 应用场景 —— API 校验 07:50 应用场景 —— 后端 HTTP 参数校验 09:10 Zod 实用小技巧 —— Infer 09:50 Zod 实用小技巧 —— Don't Trust, Verify 11:10 Zod 的竞争者们 —— Joi, Yup 12:20 总结：用起来呀～相关链接 Zod: https://zod.dev/ Zodios: https://www.zodios.org/ Sentry: https://sentry.io/welcome/ Joi: https://github.com/hapijs/joi Yup: https://github.com/jquense/yup 扩展阅读 2 hidden ways to get more from your Gmail address: https://gmail.googleblog.com/2008/03/2-hidden-ways-to-get-more-from-your.html Don't Trust, Verify: 很久之前看的文章，找不到了，请自行搜索。 Zod 对比: https://zod.dev/?id=comparison BGM by Otologic…

1
EP28 这次咱肯定全栈了 - React Server Component 18:29

cách đây 2 years trước18:29

18:29

React Server Component 是最近的大事。本期蹭一次热点，锐评 RSC 和 Next.js。做前端的朋友们，这次，必须得学后端了哦。本期内容比较追热点且较为主观。如果有任何想法或者意见也欢迎留言或者邮件交流: async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:30 Server Component 是 React 又一个巨大 feature 00:50 从后端主导的 web framework 也许正在慢慢向前端倾斜 03:10 Next.js 的 server component 实现大方向很棒，但是小缺点也不少 04:40 缺点: 开发思维转换为 Node 模式 06:10 缺点: use 指令过于魔法 07:10 缺点: CSS in JS 寄了（目前） 08:40 缺点: 框架设计可复杂了，比如路由 09:40 缺点: Cache 有点儿糙。后端的 Cache 和前端是完全不同的思路 11:50 缺点: Fetch 复杂且 HTTP handler 的设计思维不同 14:00 JWT 又又又不行了. Make Cookie Great Again 15:00 Debug 又不一样了，更更更困难了 16:00 必须得学后端了，以及强推去学习 Ruby on Rails 17:10 短期问题挺多，长期会把 Web 开发带向新的高度相关链接 Routing Fundamentals - Next.js: https://nextjs.org/docs/app/building-your-application/routing 扩展阅读 RSC From Scratch https://github.com/reactwg/server-components/discussions/5 Everything I wish I knew before moving 50,000 lines of code to React Server Components https://www.mux.com/blog/what-are-react-server-components Ruby on Rails: https://rubyonrails.org/ BGM by Otologic…

1
EP27 组件开发和路易十六有什么关系？- Headless Component 12:19

cách đây 2 years trước12:19

12:19

大家好啊，本次更新带来了 Headless Component 的简要介绍，它的优势在于逻辑分离，更好地集成设计系统，易于测试；缺点则是会让架构复杂一层，以及完全不同的开发思维。大家可以考虑在自己的业务中尝试这种新颖有趣的技术方案。但是也要注意业务场景。有任何意见建议想法，都可以在评论区留言或者发邮件至 async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:18 Headless Component 是什么 01:27 优势: 逻辑重用，分离 UI，集成自定义设计系统，易于测试 05:30 弊端: 架构复杂，不同的开发思维 07:00 实例: TanStack table, react-hook-form 09:23 btw: 多数组件库不适应新的 React Server Component 10:38 大势所趋 11:20 但是取决于业务。to C 项目比较适合相关链接 React hook form: https://react-hook-form.com/ Ant Design: https://ant.design/index-cn Material UI: https://mui.com/ chakra UI: https://chakra-ui.com/ arco design: https://arco.bytedance.net/ Puppeteer - a headless browser: https://pptr.dev/ TanStack Table: https://tanstack.com/table/v8 扩展阅读 HEADLESS USER INTERFACE COMPONENTS： https://www.merrickchristensen.com/articles/headless-user-interface-components/ BGM by Otologic…

1
EP26 那些无疾而终的技术项目们 24:35

cách đây 2 years trước24:35

24:35

最近 AnnatarHe 接了 next.js 的 App dir 出了一些问题，由此想到了一些无疾而终的项目。本期节目主要从这些虎头蛇尾的项目中探讨 - 技术选项怎么能不被 “骗” - 项目靠暴力营销能行吗大家有什么想聊的想说的，或者对节目有什么意见或者建议欢迎发邮件到 async.talk@gmail.com 另外，其实还想说 Tengine 但是查了下 commit，一年里还是有两三次 commit 的，饶过它了主播 AnnatarHe: https://annatarhe.com Timeline 00:20 从 next.js 的 app directory 画的饼谈起 03:25 翻翻 Vercel 的旧账 —— next.js 的类型问题, swc 编译出错 04:50 Mongo 当年营销很猛 06:05 某大厂虎头蛇尾项目集锦 - weex 07:48 某大厂虎头蛇尾项目集锦 - remax 09:40 Swift 的用户很励志，每年都学新语言 10:25 SwiftUI 用户很善良，每年都被坑 13:01 那些无疾而终的框架，有比伤心更严重的后果 14:50 员工要挣 credit 升职加薪，企业也要拿信誉做大做强 15:20 技术选项，怎么不被骗 - benchmark, 文档和 “代价是什么呢？” 19:20 项目需要营销，但是也得考虑长远发展 20:35 项目的支点 —— 热情，责任和钱 21:02 (我相信)没有项目一开始只想着割韭菜，项目也得想除了热情，如何持续发展 22:50 总结：多问一句 “代价是什么” 23:35 总结：在激情褪去之后，靠什么维持项目？相关链接 React Server Component: https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components Railway.app: https://railway.app?referralCode=Ahd-pk swc: https://swc.rs/ weex: https://weexapp.com/ react reconciler: https://github.com/facebook/react/tree/main/packages/react-reconciler react native: https://reactnative.dev/ remax: https://github.com/remaxjs/remax/issues/1977 taro: https://docs.taro.zone/docs/ BGM by Otologic…

1
EP25 还有没有新的花活？WASM, web container & NodeBox 16:37

cách đây 2 years trước16:37

16:37

Hi, 大家劳动节快乐～新一期的 AsyncTalk 从 Web Container 与 NodeBox 开始，探讨 Web Assembly 的发展与目前的状态，结论是虽然这些相关的产品在 AnnatarHe 看来前景并不乐观，但是 Web Assembly 技术已然成熟，可以尝试参与到我们的业务中，提升用户体验与性能。 11:20 部分的英文是 code reusable 不是 code review 主播读音有问题 � 主播 AnnatarHe: https://annatarhe.com Timeline 00:25 主题: web assembly 01:10 web assembly 的概述 —— 语言无关，性能，安全 03:24 这东西真的有用？！ 03:40 Web Container 05:02 NodeBox 06:30 web assembly 有没有缺点？—— 业务复杂度，debug 困难，只能做纯计算 08:40 debug 困难也许不是 bug 而是 feature 09:09 bundle 过大 10:19 应用场景有哪些？ Photoshop 网页版？sandbox？ 13:35 真正有用的场景在哪里？—— 加密，跨平台 15:50 web assembly 已经比较成熟了，可以上生产试试看相关链接 Introducing WebContainers: Run Node.js natively in your browser: https://blog.stackblitz.com/posts/introducing-webcontainers/ Announcing Sandpack 2.0 and a Node.js runtime for any browser: https://codesandbox.io/blog/announcing-sandpack-2 nodebox runtime: https://github.com/codesandbox/nodebox-runtime gzip: https://www.gnu.org/software/gzip/manual/gzip.html brotli: https://github.com/google/brotli 扩展阅读事后看了下 web 版的 photoshop，一个 apollo_assets 的 wasm 文件有 58 MB � BGM by Otologic…

1
EP24 龙哥锐评 Rspack，开源与新加坡生活 52:57

cách đây 2 years trước52:57

52:57

本期节目成功拉到子龙和大家一起从 Rspack 开始，探讨开源和 ChatGPT，也有一些新加坡的生活。有任何意见或者建议请联系 async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com 嘉宾子龙/龙哥 Timeline 00:11 子龙的自我介绍 03:23 Rspack 看起来好像确实能用 05:45 ECharts —— 国产开源之光 09:36 开源项目也是要吃饭的 —— 大公司做开源项目有什么好处 13:15 前端卷 rust 之后，debug 成本也越来越高 14:40 前端去搞 rust 做这些性能提升真的有必要吗？ 18:20 降本增效背景下，大家都想搞副业 20:10 做开源(core-js)不太能挣钱 22:22 但是，做开源是每个程序员的梦想 23:12 ChatGPT 无所不知 25:17 但取代专业程序员还尚需时日 29:00 很怪，国内程序员限制巨大，但是水平怎么都还比较不错呢？ 33:10 海外生活 —— 生活成本巨高，房租，吃饭 37:20 海外生活的学习 —— 语言，金融系统 41:40 这边也卷，但 “卷” 的概念并不一样 43:48 新加坡怎么没胖子 45:40 新加坡厨师们，请加把劲儿 46:50 子龙觉得新加坡挺小，AnnatarHe 觉得新加坡很大 49:50 新加坡的公关做得非常好 51:40 有机会出去的话，要勇于探索一些不同相关链接 turbopack: https://turbo.build/pack vercel: https://vercel.com/ rspack: https://www.rspack.dev/ modernjs: https://modernjs.dev/ ECharts: https://echarts.apache.org/zh/index.html webpack: https://webpack.js.org/ parcel: https://parceljs.org/ 扩展阅读 TurboPack 卷起来了: https://asynctalk.com/posts/ep20/ core-js - So, what’s next? https://github.com/zloirock/core-js/blob/master/docs/2023-02-14-so-whats-next.md BGM by Otologic…

1
EP23 让拉数据，像呼吸一样自然 20:29

cách đây 2 years trước20:29

20:29

本期节目主要介绍了请求数据时常遇到的问题以及React框架下的几种解决方案。最后,我们将介绍本期的主角React Query,包括它的设计和功能。如果有任何意见和建议可以发邮件至 async.talk@gmail.com 如果愿意加入我们的 discord 社区可以点击这里: https://discord.gg/TQczjSJMah 主播 AnnatarHe: https://annatarhe.com Timeline 00:00 开场，确实鸽了段时间 00:35 在 discord 上开了个社区，想来聊天可以加 01:20 请求数据，不像说的那么简单 02:15 loading 说起来容易，做起来麻烦 03:20 in/revalidation 也挺麻烦的 05:25 cancel 也不好处理 07:10 有 devtool 的话，会比想象中更方便 07:30 把前后端交互做好，下班时间（也许会）显著提前 08:10 ahooks 陪跑 08:50 apollo client 仅限于 GraphQL 09:30 SWR 10:30 SWR 翻页数据有想法 12:11 React Query 13:23 Mutation 的支持 14:10 对 TypeScript 的支持较好 14:40 不要 debounce 了，直接取消请求吧 16:29 甚至支持直接生成 GraphQL 16:45 devtool 要比预想中的好用很多 17:07 ReactQuery 的 cache 要是能更强一点儿就更好了 18:20 使用 ReactQuery 记得至少分两层架构 19:00 实现不难，难的是怎么想出来的 20:12 有想法就去实现，下一个万 star 项目属于你相关链接 AsyncTalk 的 discord 社群: https://discord.gg/8XXfh6jh Document: visibilitychange event**:** https://developer.mozilla.org/en-US/docs/Web/API/Document/visibilitychange_event AbortController: https://developer.mozilla.org/en-US/docs/Web/API/AbortController React.Suspense: https://beta.reactjs.org/reference/react/Suspense ahooks.useRequest: https://ahooks.js.org/hooks/use-request/index apollo client: https://github.com/apollographql/apollo-client SWR: https://swr.vercel.app/zh-CN ReactQuery 对 TypeScript 的支持: https://tanstack.com/query/v4/docs/react/typescript ReactQuery 对于 GraphQL 的集成与支持: https://tanstack.com/query/v4/docs/react/graphql � 勘误 SWR 2.0 支持了 Mutation: https://swr.vercel.app/zh-CN/blog/swr-v2#useswrmutation BGM by Otologic…

1
EP22 Code is cheap, let’s talk 16:44

cách đây 2 years trước16:44

16:44

前期准备不太充分，节目中有些内容没有表达出来。一个是我们在做库或者框架的时候，要有一个特点，更重要的是要有设计哲学。第二点忘记推荐 unix philosophy，非常精彩。第三点忘记对比几种设计哲学了，设计思想之间的碰撞非常有意思。在很多时候，软件工程的设计是一个 trade off 的过程。如果我们想要 clickhouse 那样超强的写入计算，那么事务就很难加入进去。迷茫的时候，这些哲学思想可以帮助我们走出困境，设计出更好的 API，提供更好的开发体验，优化出更好的性能。节目中没有提到的可维护性也是非常重要的一点，尤其在这样降本增效的大背景下，运营维护成本也不容忽视。最后，还是节目中提到的，所有的设计哲学的前提是要有基础的能力。千万不能只会拼凑名词，夸夸其谈。一定要先写好代码有任何意见或者建议，可以联系我们 async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:44 更新频率又更新了 01:20 今天的主题 —— Code is cheap, let’s talk 02:18 文档中 Principles 一节非常重要 03:12 react, redux, react-testing-library, tailwind 的设计哲学 07:12 很多时候写代码不是能做什么，而是不做什么 08:24 我们在做库的时候，可以从哪些方面考虑 —— 性能，颜值正义，开发便捷，语法简单，高可用 12:00 负面例子 —— 我不能理解它设计逻辑的某个库 14:06 做产品一定要有设计哲学/原则。 15:10 基础能力是设计原则的基础，不能只会装。 16:20 抄作业最好也只能抄到第二名相关链接 Flux: In-Depth Overview https://facebook.github.io/flux/docs/in-depth-overview React Testing Library: Guiding Principles ****: https://testing-library.com/docs/guiding-principles TailwindCSS: Utility-First Fundamentals: https://tailwindcss.com/docs/utility-first ByteByteGo: System Design: Why is Kafka fast? : https://www.youtube.com/watch?v=UNUz1-msbOM Starship: https://starship.rs/guide/ Formik: https://formik.org/ React hook form: https://react-hook-form.com/ BGM by Otologic…

1
EP21 GraphQL —— 一种连首富都搞不定的 “新” 技术 32:26

cách đây 2 years trước32:26

32:26

本期节目讨论了一些 GraphQL 相关的内容。介绍 GraphQL 的发展，优势，缺点以及对应的一些解决方案。有问题可以联系 async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:14 没有听众群，刷题和 chatGPT 02:30 首富不懂 GraphQL? 04:30 介绍 GraphQL 以及为什么有用 10:50 GraphQL 的发展，应用，变种 16:25 有谁在用 GraphQL 17:40 GraphQL 有什么优势 —— 沟通成本降低，类型更加健壮，前端缓存更好做 18:49 GraphQL 有什么缺点? —— 学习成本较高，后端性能不好控制，过度请求 20:40 缺点的解决方案有哪些 —— 学，做性能追踪，做 query 管理服务 27:30 关于 Cache 30:00 安利 —— 快试试 GraphQL ! 相关链接首富吐槽 Twitter 慢是请求比较多. https://twitter.com/elonmusk/status/1591853644944932865?s=61&t=uoOc4m9XOFxNqcCksnbcgw GraphQL - A query language for your API: https://graphql.org/ Relay Modern: Simpler, faster, more extensible**:** https://engineering.fb.com/2017/04/18/web/relay-modern-simpler-faster-more-extensible/ DSL - Domain specific language graph-gophers/graphql-go: https://github.com/graph-gophers/graphql-go Apollo CLI(deprecated): https://www.apollographql.com/docs/devtools/cli/ GraphQL code generator: https://the-guild.dev/graphql/codegen BGM by Otologic…

1
EP20 TurboPack 卷起来了 19:53

cách đây 2 years trước19:53

19:53

本期节目我们来蹭一下 Turbopack 的热点，谈了一些关于 packer 相关的变化。那么假如听众你要来做一个新的 packer，你会怎么设计呢？本期用了新软件剪辑，也许有很多问题，听众有问题可以直接留言或发邮件。节目内容如有错误也请帮忙纠正，非常感谢～邮件地址： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Timeline 00:00 介绍及团队说明 00:42 Vercel 新的发布会与 Turbo pack 03:40 天下苦 Webpack 久矣？为什么？ 06:10 Babel 也许并不是很好的选择 07:10 也许语言也会拖慢 Webpack 09:30 loader 们同样的事情做了很多次 10:10 Vite 的赢面看起来挺大，Rome, Parcel 也不错 13:22 Webpack 由于生态和兼容，大概还是会继续统治前端构建 15:40 假如来做一个新的 packer, 会怎么做呢？ 19:15 听众你会怎么做呢？相关链接 Turbopack 的 release tweet: https://twitter.com/vercel/status/1584961746418208774 Is Turbopack really 10x Faster than Vite? https://github.com/yyx990803/vite-vs-next-turbo-hmr/discussions/8 https://twitter.com/ruanyf/status/1392101064866885638 Announcing Rome v10****:**** https://rome.tools/blog/2022/11/08/rome-10/ Parcel v2.8.0: https://parceljs.org/blog/v2-8-0/ esbuild benchmark: https://esbuild.github.io/faq/ SWC benchmark: https://swc.rs/docs/benchmarks Announcing Parcel CSS: A new CSS parser, compiler, and minifier written in Rust! : https://parceljs.org/blog/parcel-css/ BGM by Otologic…

1
EP19 上班也就图一乐，真挣钱还得卖 App （吗？） 36:35

cách đây 2 years trước36:35

36:35

在又一次紧张刺激的停更后，我们和 Roc 一起谈了谈 side project 与独立开发的一些事情。主要包括为什么要做独立开发，收益如何，最后再打个绩效。希望大家可以 happy coding~ 有任何意见建议也欢迎联系我们: async.talk@gmail.com 名词解释 ROI: Return on Investment 投入产出比 RD: Research & Development 本节目中多数意为工程师/开发/程序员 PM: Product Manager 本期节目中特指产品经理主播 Roc: https://twitter.com/roczhang9673 AnnatarHe: https://annatarhe.com Sleaf: https://twitter.com/Sleaf_ Timeline 00:33 Roc 与停更的说明 01:40 独立开发一般做点儿什么 App ? 03:20 Roc 做的一些 App 07:50 为啥不太高兴做 Android ? 11:20 完全不上班，靠卖 App 生活现实吗 ? 14:30 除开资金，还会有什么其他收益 ? 25:30 Sleaf 与 AnnatarHe 做 AsyncTalk 是怎么想的 27:00 Roc 给自己的独立开发生活打个绩效吧 28:00 做独立应用会有一些意想不到的 bonus 30:40 替 Roc 做的广告 33:00 Roc 的个人感悟 34:20 如果你迷茫颓废了，做个 App 开心一下吧相关链接 App: X Progress https://apps.apple.com/us/app/x-progress/id1359786804 App: Mr. Weather https://apps.apple.com/us/app/mr-weather-2/id1453150372 BGM by Otologic…

1
EP18 “差生”文具多 - 软件 20:19

cách đây 3 years trước20:19

20:19

第 18 期几位主播聊了一些关于我们自己日常用的编辑器，插件和 App。如果有什么好用的东西也可以评论或者留言给我们哦: async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Sleaf: https://twitter.com/Sleaf_ Tinko: https://space.bilibili.com/290664 小鹿 Timeline 00:40 编辑器，IDE 与插件 09:05 开发相关的一些 App 也很好用～ 18:00 Atom —— 时代的眼泪相关链接 Jetbrains’ Free Educational License: https://www.jetbrains.com/community/education/#students Emmet: https://emmet.io/ VS Code Remote Development: https://code.visualstudio.com/docs/remote/remote-overview GitLens: https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens rust-analyzer: https://marketplace.visualstudio.com/items?itemName=rust-lang.rust-analyzer AnnatarHe 的 vimrc 配置: https://github.com/AnnatarHe/vim-config Emacs Evil mode: https://github.com/emacs-evil/evil Alfred: https://www.alfredapp.com/ uTools: https://www.u.tools/ raycast: https://www.raycast.com/ Xcodes.app: https://github.com/RobotsAndPencils/XcodesApp NetNewsWire: https://netnewswire.com/ reeder app: https://reederapp.com/ craft: https://www.craft.do/ shottr: https://shottr.cc/ TablePlus: https://tableplus.com/ sqlectron: https://sqlectron.github.io/ Sunsetting Atom****:**** https://github.blog/2022-06-08-sunsetting-atom/ 扩展阅读安裝 Xcode 的正確姿勢: https://www.notion.so/Xcode-dfbe2d934ff84b2d84e34ffceef56fe0 weak self ep85 iOS 開發者之痛、iOS 開發者之恥 — Xcode 管理學: https://weakself.dev/episodes/85 BGM by Otologic…

1
EP17 “差生”文具多 - 开发工具 23:51

cách đây 3 years trước23:51

23:51

第 17 期几位主播聊了一些关于我们自己日常用的一些 Terminal, Shell 和命令。如果有什么好用的东西也可以评论或者留言给我们哦: async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Sleaf: https://twitter.com/Sleaf_ Tinko: https://space.bilibili.com/290664 小鹿 Timeline 01:17 入题：差生文具多 01:22 Terminal 10:18 Shell 14:20 命令 23:30 结语，还有下一集哦相关链接 iTerm2: https://iterm2.com/ Dracula Theme: https://draculatheme.com/ tmux: https://github.com/tmux/tmux/wiki Powerline fonts: https://github.com/powerline/fonts Maple Mono font: https://github.com/subframe7536/Maple-font Warp Terminal: https://www.warp.dev/ tldr: https://github.com/tldr-pages/tldr thefuck: https://github.com/nvbn/thefuck hyper.js: https://hyper.is/ putty: https://www.putty.org/ Microsoft terminal: https://github.com/microsoft/terminal Zsh: https://www.zsh.org/ oh my zsh: https://ohmyz.sh/ fish shell: https://fishshell.com/ oh my fish: https://github.com/oh-my-fish/oh-my-fish ash: https://en.wikipedia.org/wiki/Almquist_shell nushell: https://www.nushell.sh/ fkill: https://github.com/sindresorhus/fkill-cli ripgrep: https://github.com/BurntSushi/ripgrep jq: https://stedolan.github.io/jq/ httpie: https://httpie.io/ fzf: https://github.com/junegunn/fzf ag: https://github.com/ggreer/the_silver_searcher bat: https://github.com/sharkdp/bat delta: https://github.com/dandavison/delta diff-so-fancy: https://github.com/so-fancy/diff-so-fancy beyond compare: https://www.scootersoftware.com/ zx: https://github.com/google/zx BGM by Otologic…

1
EP16 定宽容器长文本缩放 23:43

cách đây 3 years trước23:43

23:43

本期从一个问题开始如何在一个定宽 div 中展示一个可能会略长一些的文本在探索方案的同时，我们也聊了一些关于如何提问可以更有效地获取答案的方式。有任何问题可以邮件或评论区联系： async.talk@gamil.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline 01:00 问题起因，如何在定宽文本中放入文本 08:00 质疑需求 16:16 提问的智慧相关链接 Letter spacing: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing Marquee tag: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/marquee html2canvas: https://www.npmjs.com/package/html2canvas Canvas.fillText: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/fillText 录播软件 OBS: https://obsproject.com/ 提问的智慧: https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md BGM by Otologic…

1
EP15 前端的状态管理 25:08

cách đây 3 years trước25:08

25:08

这一期我们一起看一些前端状态管理的方案，从 window.store 到 Flux 的变化，双向绑定与单向数据流又是怎样的妥协与融合，从客户端手动管理到 type based cache 的发展又有怎样的经历。有任何想法欢迎邮件联系： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline 02:05 全局状态的用处 04:00 全局状态管理的进化 05:33 Flux 的新时代 07:45 this.$store.x = 1 违背了 Flux 原则吗？ 10:20 双向绑定是不是一个错误的方向 12:28 新方案 Pinia 与 Recoil 17:19 没有 store 的全局状态管理怎么样呢？ 22:18 状态机？相关链接 IIFE: https://developer.mozilla.org/en-US/docs/Glossary/IIFE Flux： https://juejin.cn/post/6844904054921887758 Redux: https://redux.js.org/ Vuex: https://vuex.vuejs.org/ Mobx: https://mobx.js.org/README.html Recoil: https://recoiljs.org/ Pinia: https://pinia.vuejs.org/ useSWR: https://swr.vercel.app/ GraphQL: https://graphql.org/ Apollo Cache: https://www.apollographql.com/docs/react/caching/overview BGM by Otologic…

1
EP14 bun 新生煎出炉啦 23:23

cách đây 3 years trước23:23

23:23

这期节目我们追一追时下比较火的 bun — a fast all-in-one JavaScript runtime 来听听主播们都看了点儿什么。节目中有任何问题，意见或者建议均可邮件联系： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 小鹿节目中提到的 fib 代码如下：运行结果如图： Timeline: 0:54 最近新出了个 bun 3:26 bun 的性能到底有多好？ 6:31 所以 deno 的意义是什么呢？ 7:26 bun 的一些 API 似乎不全？ 10:21 bun 的串口通信怎么样 10:59 Zig lang 看不懂呀 13:10 你用 bun 装包了吗？ 14:00 bun 的 IO 似乎很快 18:33 Edge computing 21:03 阿里前端近年来风评问题 23:15 bun 就到这里了相关链接 https://bun.sh/ https://hhvm.com/ https://hacklang.org/ carbon lang: https://github.com/carbon-language/carbon-lang bun 的 fs IO 有点儿快: https://twitter.com/jarredsumner/status/1556948257007210496 Web-interoperable Runtimes Community Group: https://wintercg.org/ egg.js: https://www.eggjs.org/ typescript LLVM: https://github.com/ASDAlexander77/TypeScriptCompiler os.arch() and os.platform() are not correct: https://github.com/oven-sh/bun/issues/173 BGM by Otologic…

1
EP13 浏览器最近的新功能 20:47

cách đây 3 years trước20:47

20:47

第二季的开始我们先从浏览器近几年出的 API 谈起，聊一聊浏览器能多做些什么联系我们： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ Timeline 00:30 新一季想多聊聊新东西 02:05 monaco 做得不错~ 02:55 Permission 03:53 新的 API 好像大多需要 HTTPS 了 05:00 Local Notification & Push Notification 08:50 剪切与粘贴 12:26 video 的自动执行 16:17 主播自用 API 相关链接 Monaco Editor: https://microsoft.github.io/monaco-editor/ Progressive Web Apps: https://web.dev/progressive-web-apps/ 棱镜门事件: https://zh.m.wikipedia.org/zh-hk/稜鏡計畫 Notification API: https://developer.mozilla.org/en-US/docs/Web/API/notification Firebase: https://firebase.google.com/ clipboardjs: https://clipboardjs.com/ Clipboard API: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API Selection API: https://developer.mozilla.org/en-US/docs/Web/API/Selection execCommand API: https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand ClipboardActionCopy 的实现: https://github.com/zenorocha/clipboard.js/blob/2b2f9eef6fd1cf951612740e16e422db2848c00a/src/actions/copy.js#L27 safari 在低电量模式下不会播放 muted video: https://developer.apple.com/forums/thread/709821 Battery Status API: https://developer.mozilla.org/en-US/docs/Web/API/Battery_Status_API Fullscreen API: https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API Picture in Picture API: https://developer.mozilla.org/en-US/docs/Web/API/Picture-in-Picture_API 修正节目中提到execCommand的复制内容，经过测试实际上是无须用户先进行真人交互的click操作的 BGM by Otologic…

1
SP2 第一季结束啦 2:09

cách đây 3 years trước2:09

2:09

这是一期特别节目，主要内容是我们第一季节目结束，第二季会在 8.11 继续更新。有任何意见建议欢迎留言或邮件至 async.talk@gmail.com

1
EP12 官网与 SEO 43:01

cách đây 3 years trước43:01

43:01

在节目进行到第 12 期的时候，我们终于写了个自己的官网。以此为契机聊了一些 SEO (搜索引擎优化) 相关的话题联系我们： async.talk@gmail.com 关键名词： SEO: Search Engine Optimization CSR: client side rendering - 客户端渲染 SSR: server side rendering - 服务端渲染 Nextjs: 一个支持 SSR 的 React 框架主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline 0:00 开场 0:19 我们写了个官网 1:02 什么是 SEO 3:42 搜索引擎是怎么看网页的 15:00 OpenGraph 是个好东西 18:37 有些网站其实不想被爬 21:30 怎么提高网站的搜索权重 24:03 搜索引擎的流量在减少 25:42 怎么搜索引擎爬到东西 31:30 自己做一个 SSR ？ 39:45 一些有趣网站的实践相关链接 https://asynctalk.com/ puppteer: https://github.com/puppeteer/puppeteer 语义化标注 https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles robots.txt Open Graph Protocol: https://ogp.me/ uBlacklist: https://chrome.google.com/webstore/detail/ublacklist/pncfbmialoiaghdehhbnbhkkgmjanfhe https://prerender.io/ https://nextjs.org/ 如何移除你项目中 99% 的JS代码: https://mp.weixin.qq.com/s/UG3T9mpzGA-Co1TBywNCNw https://archive.org/ 分享图生成 https://imgg.gg/ next 的 bug? 一个关于 typescript 执行不一致的问题： https://github.com/vercel/next.js/issues/27871 PageRank: http://ilpubs.stanford.edu:8090/422/1/1999-66.pdf v2ex - 程序员论坛: https://v2ex.com/ BGM by Otologic…

1
EP11 与 Event 斗争的血泪史 46:51

cách đây 3 years trước46:51

46:51

本期节目主播们在谈天说地之余聊了些关于 Event 相关的话题，从浏览器事件模型到性能优化都没丢下。由于 lock down 带来的影响尚未散去，主播们普遍未能恢复到完全的状态，本期节目还请大家多多包涵。但如果内容有误请务必不要照顾我们，可以通过邮件或者直接评论留言的方式联系我们指正。感谢～邮件：async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline 0:48 引题 - Event 1:24 Event 是什么 5:11 浏览器事件模型 9:10 AbortSignal 与 once 10:58 浏览器生命周期事件 14:35 I'm not robot! 17:47 event.target & currentTarget 18:47 无聊的面试题：事件委托 20:39 不是面试题的 Event Loop 23:51 Node Event Loop 以及你为啥不该知道 32:08 脱离前端的 Event 32:38 Event 有啥用呢？挣钱，解耦 33:56 ”事件“ 概念的杰出代表 — Nginx 35:37 一道有趣的面试题 39:15 解决问题可以靠工程，也可以用算法 40:52 如何优化高复杂度的问题 42:09 蹭个 react fiber 的热度 43:15 性能有问题？分片! 45:21 关于未发布节目的说明 — 我们倾向于做正能量节目相关链接 Document: visibilitychange event: https://developer.mozilla.org/en-US/docs/Web/API/Document/visibilitychange_event Intersection Observer API: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API What is the exact difference between currentTarget property and target property in JavaScript: https://stackoverflow.com/questions/10086427/what-is-the-exact-difference-between-currenttarget-property-and-target-property React SyntheticEvent: https://reactjs.org/docs/events.html The Node.js Event Loop, Timers, and process.nextTick(): https://nodejs.org/en/docs/guides/event-loop-timers-and-nexttick/ tauri: https://github.com/tauri-apps/tauri This new iOS 16 feature will rid the web of pesky CAPTCHA verification puzzles: https://9to5mac.com/2022/06/20/ios-16-bypass-captchas/ Difference between microtask and macrotask within an event loop context: https://stackoverflow.com/questions/25915634/difference-between-microtask-and-macrotask-within-an-event-loop-context SPEC task queue: https://html.spec.whatwg.org/multipage/webappapis.html#task-queue tokio: https://github.com/tokio-rs/tokio Thread Pools in NGINX Boost Performance 9x! https://www.nginx.com/blog/thread-pools-boost-performance-9x/ React Fiber Architecture: https://github.com/acdlite/react-fiber-architecture 扩展阅读 How Apple could kill CAPTCHAs with Private Access Tokens https://appleinsider.com/articles/22/06/14/how-apple-could-kill-captchas-with-private-access-tokens BGM by Otologic…

1
EP10 出海，国际化 1:02:34

cách đây 3 years trước1:02:34

1:02:34

本期节目我们请到了一位强力外援李叶( https://github.com/leeyeh/ ) 来一起谈一谈出海国际化的各种问题。这期节目只有大概一小时，但是内容却相当丰富，谈及了语言，数字及文化方面的国际化注意事项及一些解决方案。最后发现还是做国内市场最简单 :) 主播: 李叶: https://github.com/leeyeh/ AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline: 0:34 为什么要出海啊 2:17 i18n, l10n 都是什么？ 5:30 语言的国际化要解决什么问题 7:41 单复数还挺复杂的哦 10:59 千？万？ 14:43 什么？windows 日版路径分隔用￥ 17:30 语法与语言 20:43 国际化那么多标准，哪儿来的数据？ 28:07 大型项目的国际化文案怎么做？ 36:44 时间的国际化 44:16 只做国内产品挺好的 44:41 国际化是怎么区分语言和地区的呢？ 48:51 国际化 — 隐私与政策 52:14 国际化 — 圣诞节到底过不过 54:03 国际化 — 顿涅兹克的地图该怎么画 57:06 国际化 — 手机号就算了吧 58:39 国际化 — 性别可别用 boolean 哦 1:00:16 总结 — 出海还真不容易相关链接: i18n 与 l18n 的区别 : https://www.w3.org/International/questions/qa-i18n CLDR : https://cldr.unicode.org/index IETF BCP 47 language tag: https://en.wikipedia.org/wiki/IETF_language_tag Ant Design 圣诞节事件（注：链接中被离职的文字并没有找到有力证据佐证）： Ant Design 圣诞地雷: https://www.v2ex.com/t/520690?p=1 https://github.com/ant-design/ant-design/issues/13098#issuecomment-449786093 https://github.com/ant-design/ant-design/issues/13098#issuecomment-449786560 https://github.com/ant-design/ant-design/issues/13098#issuecomment-449786655 Intl: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl 为什么日语Windows下的路径分隔符使用￥? https://www.zhihu.com/question/41218947 SwiftUI LocalizedStringKey: https://developer.apple.com/documentation/swiftui/localizedstringkey 陈浩关于飞书国际化的批评: https://twitter.com/haoel/status/1497197608908976128 GitHub 的地图像素化: https://octoverse.github.com/#future open street map: https://www.openstreetmap.org/ mysql 的 boolean 实际上是 tinyint: https://stackoverflow.com/questions/3751853/boolean-vs-tinyint1-for-boolean-values-in-mysql 扩展阅读: 李叶做的关于国际化的内部分享： https://zealous-visitor-b16.notion.site/Internationalization-Localization-1-a6f564c41f2f49189b7caecec969f02f GDPR 2 周年，我们分析了近 300 起罚款事件 https://www.infoq.cn/article/pCqvqVaD46m4NAWcoLIC 勘误: 意大利，挪威，西班牙用 . 做千的分割，而非德国 https://docs.oracle.com/cd/E19253-01/819-0402/overview-48/index.html BGM by Otologic…

1
EP09 大哥大嫂过年好，一起聊聊样式表 1:19:29

cách đây 3 years trước1:19:29

1:19:29

大家新年快乐~我们年后回归一起聊一聊 CSS 。主要介绍了几种 css 工程的思想及相关实现的代表作，探索更好的 CSS 工程形式。有任何意见或建议，欢迎联系邮件：async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline 00:30 听众反馈 02:43 让人头疼的样式表 13:02 预编译器哪家强 22:38 怎么限制 css 作用域？ 25:21 BEM？简单而臃肿 28:03 Vue 送来了 scoped 30:46 CSS Modules 好用吗 33:06 ALL IN JS! 35:43 原子性 CSS 是不是一个好的方案？ 41:22 小结，以及还有其他小众方案 42:26 这些方案有哪些落地的框架？ 46:39 最近蛮火的 Tailwind 用起来怎么样 1:02:15 styled-componets 是不是一个完美的方案？ 1:05:17 说了这么多，现在主播们会选哪个？ 1:11:02 在未来什么会消亡什么会壮大？相关链接 BEM: http://getbem.com/introduction/ LibSass is Deprecated: https://sass-lang.com/blog/libsass-is-deprecated CSS 语法 [符号]: https://developer.mozilla.org/zh-CN/docs/Web/CSS/Value_definition_syntax#符号最佳化文字資產的編碼和傳輸大小: https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/optimize-encoding-and-transfer?hl=zh-tw CSS Houdini: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Houdini 扩展阅读 An Introduction To Object Oriented CSS (OOCSS): https://www.smashingmagazine.com/2011/12/an-introduction-to-object-oriented-css-oocss/ Just-In-Time: The Next Generation of Tailwind CSS: https://tailwindcss.com/blog/just-in-time-the-next-generation-of-tailwind-css Real-world CSS vs. CSS-in-JS performance comparison: https://pustelto.com/blog/css-vs-css-in-js-perf/ postcss-rs: https://github.com/postcss-rs/postcss-rs parcel-css: https://github.com/parcel-bundler/parcel-css BGM by Otologic…

1
EP08 金三银四，来场面试(下) 1:18:22

cách đây 3 years trước1:18:22

1:18:22

第七期内容我们趁着年前各位跳槽前录了期关于面试的话题，包括了面试官和候选人的视角。也谈到了应该用什么样的态度来面试，问什么问题，也包含最后的薪酬话题。其中关于 “面试造火箭，入职拧螺丝” 的部分我们讨论比较激烈，但内容上是关于 “预期管理” 的讨论。后续也激烈讨论了老生常谈的 “性能 vs 效率“ 的话题。听众有自己的看法也欢迎留下评论或者发邮件讨论。由于本期内容过长，我们分了上、下两集。同时春节临近，我们也请假一期。下次更新时间是 2022.2.24 祝大家新年快乐~ 联系方式： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline(上) 00:31 上期反馈及回应 03:35 面试 05:22 为什么需要招人 09:00 面试官的基本素养 26:30 面试题 - “八股文” 什么看法？ 29:45 简历记得要扬长避短 36:10 开始吧，请先做个自我介绍 40:12 智力题？态度题？ 46:45 正经 web 面试题 Timeline(下) 00:24 面试题 —— 浏览器事件 01:44 面试题 —— 新规范 05:34 面试题 —— 实现 deepclone 06:44 面试题 —— 浏览器输入 url 后，发生了什么 15:54 面试题 —— 关于网络，关于加密 19:29 面试题 —— 计算机基础 24:24 面试题 —— 算法 34:49面试造火箭，入职拧螺丝？ 41:16 算法的真实应用 50:56 工程经验与个人学习 54:59 对面试官有什么需要了解的 57:47 钱和另一个东西，怎么算？ 60:36 如何选 Offer 67:31 钱怎么算 77:29 结束 + 休假 + 请假相关链接: 中国程序员容易发音错误的单词: https://github.com/shimohq/chinese-programmer-wrong-pronunciation How to vertically align an image inside a div: https://stackoverflow.com/questions/7273338/how-to-vertically-align-an-image-inside-a-div POSIX 标准: https://en.wikipedia.org/wiki/POSIX Coroutine: https://en.wikipedia.org/wiki/Coroutine ES6 Tail Recursion Optimisation Stack Overflow: https://stackoverflow.com/questions/42788139/es6-tail-recursion-optimisation-stack-overflow 薪酬报告： https://www.zhipin.com/salaryxc/c101020100_p100901.html 扩展阅读 Let it crash: https://wiki.c2.com/?LetItCrash A Crash Course In Failure: http://web.archive.org/web/20090430014122/http://nplus1.org/articles/a-crash-course-in-failure/ Announcing TypeScript 4.5: https://devblogs.microsoft.com/typescript/announcing-typescript-4-5/ TypeScript 类型体操挑战题: https://github.com/type-challenges/type-challenges RSA: https://en.wikipedia.org/wiki/RSA_(cryptosystem) BGM by Otologic…

1
EP07 金三银四，来场面试(上) 55:56

cách đây 3 years trước55:56

55:56

第七期内容我们趁着年前各位跳槽前录了期关于面试的话题，包括了面试官和候选人的视角。也谈到了应该用什么样的态度来面试，问什么问题，也包含最后的薪酬话题。其中关于 “面试造火箭，入职拧螺丝” 的部分我们讨论比较激烈，但内容上是关于 “预期管理” 的讨论。后续也激烈讨论了老生常谈的 “性能 vs 效率“ 的话题。听众有自己的看法也欢迎留下评论或者发邮件讨论。由于本期内容过长，我们分了上、下两集。同时春节临近，我们也请假一期。下次更新时间是 2022.2.24 祝大家新年快乐~ 联系方式： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline(上) 00:31 上期反馈及回应 03:35 面试 05:22 为什么需要招人 09:00 面试官的基本素养 26:30 面试题 - “八股文” 什么看法？ 29:45 简历记得要扬长避短 36:10 开始吧，请先做个自我介绍 40:12 智力题？态度题？ 46:45 正经 web 面试题 Timeline(下) 00:24 面试题 —— 浏览器事件 01:44 面试题 —— 新规范 05:34 面试题 —— 实现 deepclone 06:44 面试题 —— 浏览器输入 url 后，发生了什么 15:54 面试题 —— 关于网络，关于加密 19:29 面试题 —— 计算机基础 24:24 面试题 —— 算法 34:49面试造火箭，入职拧螺丝？ 41:16 算法的真实应用 50:56 工程经验与个人学习 54:59 对面试官有什么需要了解的 57:47 钱和另一个东西，怎么算？ 60:36 如何选 Offer 67:31 钱怎么算 77:29 结束 + 休假 + 请假相关链接中国程序员容易发音错误的单词: https://github.com/shimohq/chinese-programmer-wrong-pronunciation How to vertically align an image inside a div: https://stackoverflow.com/questions/7273338/how-to-vertically-align-an-image-inside-a-div POSIX 标准: https://en.wikipedia.org/wiki/POSIX Coroutine: https://en.wikipedia.org/wiki/Coroutine ES6 Tail Recursion Optimisation Stack Overflow: https://stackoverflow.com/questions/42788139/es6-tail-recursion-optimisation-stack-overflow 薪酬报告： https://www.zhipin.com/salaryxc/c101020100_p100901.html 扩展阅读 Let it crash: https://wiki.c2.com/?LetItCrash A Crash Course In Failure: http://web.archive.org/web/20090430014122/http://nplus1.org/articles/a-crash-course-in-failure/ Announcing TypeScript 4.5: https://devblogs.microsoft.com/typescript/announcing-typescript-4-5/ TypeScript 类型体操挑战题: https://github.com/type-challenges/type-challenges RSA: https://en.wikipedia.org/wiki/RSA_(cryptosystem) BGM by Otologic…

1
EP06 Low Code 到底 Low 不 Low 1:04:16

cách đây 3 years trước1:04:16

1:04:16

本期节目我们终于蹭上了热点 —— 低代码(Low Code)。主播们根据自己的经历谈了些应用场景和实现等相关话题，展望未来的低代码平台应该是什么样子。希望能对听众在构建自己的低代码平台时有一定的启发。联系我们： async.talk@gmail.com 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ 小鹿 Timeline: 00:00 开场及短消息速报 04:13 进入主题：低代码 04:34 什么是低代码以及低代码的历史 08:03 低代码在 ERP ，表单，组件等实现 10:36 低代码在 to C 场景上的应用 11:40 主播们做过的低代码平台 16:37 低代码真的是毒瘤吗？ 19:50 向左图灵完备，向右垂直领域。低代码该往哪里走。 20:30 JSON 作为低代码沟通的 interface，是个合适的结构吗？ 27:39 eval ? with ? 29:32 蹭个热点 Log4j （顺便再黑一把 Java） 30:10 低代码的渲染选型与实践 33:10 低代码是不是需要预编译？ 39:30 运行时的性能有那些潜在问题 49:16 低代码平台对 leader 的要求比较高 50:12 低代码平台还有哪些需要解决的问题 54:00 github copilot 会是低代码的竞争对手吗？ 57:57 低代码平台未来会成为什么样子，它会让我们失业吗？ 62:28 废话时间相关链接 dreamwaver: https://www.adobe.com/hk_en/products/dreamweaver.html DSL(Domain-specific language): https://en.wikipedia.org/wiki/Domain-specific_language 图灵完备: https://zh.wikipedia.org/wiki/圖靈完備性 Node.js Helps NASA Keep Astronauts Safe and Data Accessible: https://openjsf.org/wp-content/uploads/sites/84/2020/02/Case_Study-Node.js-NASA.pdf 上线了: https://sxl.cn Ali 的 formily: https://designable-antd.formilyjs.org/ plasmic: https://www.plasmic.app/ image cook: https://www.imgcook.com/ “行业毒瘤”低代码: https://www.huxiu.com/article/424995.html github copilot: https://copilot.github.com/ BGM by Otologic…

1
EP05 比黑洞更深的是什么 - 关于 JS 的包管理 58:32

cách đây 3 years trước58:32

58:32

️ 本期三位主播围绕 "包管理" 聊了些 js 的包管理历史，版本管理，如何发包等问题。联系我们： async.talk@gmail.com �‍�‍� 主播 AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf: https://twitter.com/Sleaf_ ⏰ Timeline 00:00 开场简介 01:52 JavaScript 包管理历史 07:48 包管理是用来解决什么问题的 10:47 版本管理 13:50 包管理器的百家争鸣 17:53 .lock 文件即版本号的设计 24:12 how to patch a package 27:00 发个包吧 28:40 package.json 的字段有哪些 37:57 type: module 41:10 npm scripts 45:30 npm link & tag & publish 51:41 总结以及开发一个新包应该有哪些注意事项 � 勘误 Rust 是有不同的构建依赖类型的： https://doc.rust-lang.org/cargo/reference/manifest.html � 相关链接 AMD: https://github.com/amdjs/amdjs-api/blob/master/AMD.md UMD: https://dontkry.com/posts/code/browserify-and-the-universal-module-definition.html CMD(commonjs): https://nodejs.org/api/modules.html ES Module: https://tc39.es/ecma262/#sec-modules IIFE(自执行函数): https://developer.mozilla.org/en-US/docs/Glossary/IIFE require.js: https://requirejs.org/ bower: https://bower.io/ tree-shaking(摇树): https://webpack.js.org/guides/tree-shaking/ yeoman: https://yeoman.io/ yarn: https://yarnpkg.com/ pnpm: https://pnpm.io/ patch-package: https://github.com/ds300/patch-package io.js: https://github.com/nodejs/iojs.org lerna: https://github.com/lerna/lerna 包管理处理的依赖问题是比较复杂的，没能找到合适的文章，可以先从这里看起: https://en.wikipedia.org/wiki/Dependency_hell � 扩展阅读 lerna 放弃维护： https://github.com/lerna/lerna/issues/2703#issuecomment-777089520 BGM by Otologic…

1
EP04 你看我算全栈吗？- 当开始用 js 写后端 59:59

cách đây 3 years trước59:59

59:59

本期我们邀请到了子亭(@jysperm)来和我们一起聊一聊 node.js 及相关的后端和全栈概念。也欢迎大家留下自己对话题的看法及节目的评价。感谢各位的收听。联系我们： async.talk@gmail.com 主播： AnnatarHe: https://annatarhe.com Tinko: https://space.bilibili.com/290664 Sleaf https://twitter.com/Sleaf_ 嘉宾： @ziting https://jysperm.me Timeline： 00:00 开场及自我介绍 03:41 关于用 JAVA 写后端这件事 06:57 用 Rust 来写是不是一个好的选择？ 13:10 回归正题！用 Node.js 来写后端怎么样，TypeScript？Deno？ 29:02 BFF 是啥？是不是为了升职加薪炒出来的概念？ 34:31 那这些我都写了，现在我算全栈工程师了吗？ 42:00 前端和后端各自的关注点以及专业性 45:10 我们现在可以不管运维了吗？SRE 工程师是啥职位？ 51:30 聊聊现在的云平台，k8s 到底是强大还是臃肿？有替代方案吗？ 57:04 总结时间相关信息： Rust: https://www.rust-lang.org/ 我们并不需要 Deno： https://jysperm.me/2021/05/we-dont-need-deno/ errors are values: https://go.dev/blog/errors-are-values Design Doc: Use JavaScript instead of TypeScript for internal Deno Code: https://docs.google.com/document/u/0/d/1_WvwHl7BXUPmoiSeD8G83JmS8ypsTPqed4Btkqkn_-4/mobilebasic Traefik Migration Guide: From v1 to v2 https://doc.traefik.io/traefik/migration/v1-to-v2/ Frontends and Backends Are Dead... ... Long Live Routers, Middlewares, and Services 《黑客与画家》: https://book.douban.com/subject/6021440/ Unix Pipeline: https://en.wikipedia.org/wiki/Pipeline_(Unix) 付费删除 NPM 包 https://drewdevault.com/2021/11/16/Cash-for-leftpad.html 节目中提到的 K8S 竞品： https://www.hashicorp.com/products/nomad https://mesosphere.github.io/marathon/ https://docs.docker.com/engine/swarm/ 扩展阅读： Rust Is The Future of JavaScript Infrastructure: https://leerob.io/blog/rust BGM by Otologic…

1
EP03 工程师的自我修养 - 前端的工程化 1:03:52

cách đây 3 years trước1:03:52

1:03:52

为了达成 OKR 聊点儿主题相关的，这次的主题是关于前端工程化的问题，以及对未来的展望，如何身体力行地去参与创建下一代前端。内容主要三个部分 —— 开发，部署，运维希望大家可以开拓视野，尝试用初次相见的眼光看待事物，不拘泥于目前的限制。毕竟比马更快的不是马，比 TNT 更爆裂的也不是炸药。那么，比 React, Webpack 更好的，是什么呢？主播： AnnatarHe: https://web.okjike.com/u/20965c29-1f92-4df8-9107-45043db29278 Tinko: https://space.bilibili.com/290664 Sleaf Timeline: 00:00 开场 01:03 前端工程化的前世今生 05:05 现代工程化 - 开发（分支管理与 Git Flow） 12:36 当前部署流程 CI/CD 14:32 下一代构建/部署展望 23:10 下一代的 CSS 样式要怎么写？ 31:55 我们需要更高压缩率的图片格式吗？ 38:07 关于测试的讨论 46:25 下一代运维是什么样，Serverless？ 52:28 上线之后我们要做什么？ 56:37 畅想重构 web 开发流程 ref: Backbone.js https://backbonejs.org/ 各种 git 工作流 https://www.ruanyifeng.com/blog/2015/12/git-workflow.html Git-flow 已经过时 https://nvie.com/posts/a-successful-git-branching-model/ Google 不再兼容 IE https://9to5google.com/2021/10/01/google-search-internet-explorer-11/ 常见图片格式 https://juejin.cn/post/6844903625731358727 E2E 测试工具 Cypress https://www.cypress.io/ 自动文档生成工具 https://typedoc.org/ TDD(Test Driven Development) https://en.wikipedia.org/wiki/Test-driven_development Sentry https://sentry.io/ NewRelic https://newrelic.com/ Uptrace https://uptrace.dev/ Prisma https://www.prisma.io/ Rome https://rome.tools/ 更多资料: 软件开发的工作流: https://blog.forecho.com/software-development-workflow.html LeanCloud 开放资源 - 文案风格指南: https://open.leancloud.cn/copywriting-style-guide/ How We Build Code at Netflix: https://netflixtechblog.com/how-we-build-code-at-netflix-c5d9bd727f15 不需要追求 100% 的测试覆盖率 https://medium.com/@joshuakgoldberg/in-defense-of-100-unit-test-coverage-7fd1a9873ca4 联系方式：async.talk@gmail.com BGM by Otologic…

1
EP02 又不是不能用 - 跨平台方案 1:13:19

cách đây 4 years trước1:13:19

1:13:19

1
EP01 学前端的入门问题 47:40

cách đây 4 years trước47:40

47:40

在社交媒体上看到一位朋友发的牢骚，内容是这样的：想学一种前端技术，毕竟自己对产品还是也很喜欢的，想着是不是自己也能瞎搞点啥，然后就去搜：js快速入门图书推荐、学typescript之前需要先学js么、Electron跨平台使用js还是ts，vue和react哪个好？angular还值得学么。。。然后我决定学swift了我们 AsyncTalk 作为主要做 web 开发方向的工程师，针对这个问题聊了聊自己的看法。如果你刚入行前端，或者希望能学一门 GUI 技术，可以来听听看时间线： 00:00 引言 00:46 入门 JS 图书推荐 05:20 关于跨行到前端工程师的讨论 07:44 入门 CSS&HTML 图书推荐 11:01 学 TypeScript 之前需要学 JavaScript 吗？ 16:52 项目里用 TS 还是 JS？ 21:35 React, Vue, Ng 的技术应该从哪里入门 36:50 SwiftUI 的看法 41:02 结论小结主播： SleafH Tinko: tinko@bilibili AnnatarHe: AnnatarHe 联系方式： async.talk@gmail.com 注：由于收音问题，请在 21:50 左右加大音量，后期我们会尝试改进 Ref: 《JavaScript DOM 编程艺术》 https://book.douban.com/subject/6038371/ 《JavaScript 高级程序设计》（红皮书）: https://book.douban.com/subject/10546125/ 《JavaScript 语言精粹》 https://book.douban.com/subject/3590768/ 《你不知道的 JavaScript》 https://book.douban.com/subject/26351021/ 《ES6 标准入门》 https://book.douban.com/subject/27127030/ 《CSS 世界》 https://book.douban.com/subject/27615777/ 《CSS 揭秘》 https://book.douban.com/subject/26745943/ Vite： https://vitejs.dev/ W3School： https://www.w3school.com.cn/ recoiljs: https://recoiljs.org/ redux saga: https://redux-saga.js.org/ SwiftUI 多 sheet 的 bug: https://twitter.com/bigmtnstudio/status/1371590366709776391?s=21 SwiftUI NavigationStack 会被 pop to root 的 bug: https://developer.apple.com/forums/thread/677333 后记： TS 官方的态度是，学习 TS 之前必须学习 JS： https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html#learning-javascript-and-typescript eval或with等用法需要了解，一般项目里不应该使用，因为会带来额外的风险，但是在一些底层库中为了实现更加灵活的特性是需要使用这些语言特性的。 BGM by Otologic…

1
EP00 我们的目标是把前端带向下一个高度 8:47

cách đây 4 years trước8:47

8:47

这里是AsyncTalk一档面向能听懂中文，对 web 开发感兴趣的朋友所录制的 Podcast 节目。在第 0 期我们主要介绍了一下这个节目的背景和目标。后续我们会讨论更多更为前沿，工程化的话题，感兴趣可以持续关注。联系我们请发邮件至 async.talk@gmail.com 期待与您的沟通。 BGM by Otologic

Chào mừng bạn đến với Player FM!

Player FM đang quét trang web để tìm các podcast chất lượng cao cho bạn thưởng thức ngay bây giờ. Đây là ứng dụng podcast tốt nhất và hoạt động trên Android, iPhone và web. Đăng ký để đồng bộ các theo dõi trên tất cả thiết bị.

Nghe hơn 500 chủ đề

Bounty Quick Size Paper Towels, White, 8 Family Rolls = 20 Regular Rolls (Packaging May Vary)

Apple AirPods Pro 2 Wireless Earbuds, Active Noise Cancellation, Hearing Aid Feature, Bluetooth Headphones, Transparency, Personalized Spatial Audio, High-Fidelity Sound, H2 Chip, USB-C Charging

Clean Skin Club Clean Towels XL™, 100% USDA Biobased Face Towel, Disposable Face Towelette, Eczema Association Accepted, Makeup Remover Dry Wipes, Ultra Soft, 50 Ct, 1 Pack

Podcast đáng để nghe

AsyncTalk « » EP30 Server Action 是有点儿搞笑，但前端得学

EP30 Server Action 是有点儿搞笑，但前端得学

Podcast đáng để nghe

Chào mừng bạn đến với Player FM!

Ailun 3 Pack Screen Protector for iPhone 16 Pro [6.3 inch] + 3 Pack Camera Lens Protector with Installation Frame,Case Friendly Tempered Glass Film,[9H Hardness] - HD [6 Pack]

The Let Them Theory: A Life-Changing Tool That Millions of People Can't Stop Talking About

Amazon eGift Card - Bright Balloons (Animated)

Zevo Flying Insect Trap & 3 Cartridges - Plug in Fly Trap & Indoor Bug Catcher for Gnats, House & Fruit Flies - Mess-Free - Use in Any Room - Uses Blue & UV Light (1 Plug in Device & 3 Cartridges)

The Let Them Theory: A Life-Changing Tool That Millions of People Can't Stop Talking About

Hướng dẫn sử dụng nhanh

AsyncTalk « »
EP30 Server Action 是有点儿搞笑，但前端得学