AsyncTalk

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

最近工作不容易啊，来和 前端輕鬆聊 的 Eric 一起聊聊在北美的工作情况。有任何意见，建议或者评论欢迎在下面评论或者发邮件至 [email protected] 本期剪辑是分开的，也可以去听 Eric 的版本: https://fetalk.dev/episodes/ep34 主播AnnatarHe: https://annatarhe.comEric 前端輕鬆聊: https://fetalk.dev/ Timeline 00:02 欢迎 AsyncTalk 的 AnnatarHe 与 前端輕鬆聊 的 Eric00: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...

EP37 在？听说你也在卷编辑器？

或许是 AI 的发展，文本编辑迎来了又一个春天。从最原始的 Textarea 到一站式的富文本编辑器，再到最近崛起的 Headless framework，文本编辑正在不停迭代在 AI 的加持下，文本编辑会不会是一个新的窗口？如果自己做一个文本编辑器，如何做技术选型？应该做哪些功能呢？来听一听今天 AsyncTalk 吧～ 欢迎评论区留言, 给我们发邮件 [email protected] 或者在 X 留言: https://twitter.com/AsyncTalk 主播AnnatarHe: https://annatarhe.com Timeline00: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...

EP36 我们总会毕业

Shownotes AsyncTalk EP36 来谈论最近很沉重的工作话题。 因为 AnnatarHe 最近有些朋友的职业有一些变化，包括网上的一些评论和态度觉得有必要聊一聊。 这一期主要是谈论了裁员降薪的背景原因，面试没过十分正常。记得要用闲暇时间放松一下，拓展视野。 也不要对互联网沮丧，这依旧是个容量和潜力极为巨大的行业。 在公司的话，记得多跟人沟通交流，学习一些自己不会的东西，也要有自己的品味，最重要的，做个好人。 祝大家过得开心，熬过这段周期。 欢迎评论区留言, 给我们发邮件 [email protected] 或者在 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...

EP35 让我看看博客和官网应该怎么写

让我猜猜，你是不是也想自己写个博客官网啥的？ 来听听这期节目试试有没有其他有趣的方案吧～ 感谢 Roy 的赞赏 也记得要关注 twitter 哦: https://twitter.com/AsyncTalk 欢迎评论留言 [email protected] 名词解释 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 如何生成...

EP34 JS Runtime 怎么也卷起来了

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 真正的竞争力:...

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

本期节目以最近更新的 react-email 作为引子，讨论了它的出现，功能以及发展方向。同时引申到项目的想法，融资，设计和营销等方面都困难重重，并不容易。最后探讨开发者服务也许是一片新蓝海。如果你对本期节目有任何建议和意见或者希望合作，欢迎发邮件至 [email protected] 主播AnnatarHe: https://annatarhe.com Timeline00:01 新出的 react-email 让开发邮件前端更简单03:19 react-email 的 UX 做得非常棒05:00 react-email 支持众多的 SDK 与 integration06: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/introductionmjml: https://mjml.io/fix(react-email): ESM...

EP32 npm run

注：本期非技术内容 本期和 Philo 及 TK 两位组成了 SG-JP-CA 轴心就海外生活聊了聊天。从出去的原因，方式和目的地选择，到海外业务拓展，商业前景观察。内容很长，聊天蛮愉快。如果你对海外生活感兴趣，可以试着听一听。因为我们三个人呆的时间都不长，如果有什么不对的地方，欢迎评论或邮件留言 [email protected] 今天的金句:感觉活着的成分里面，生活比生存更多了一些 - TK 名词解释：SRE: Site Reliability EngineerGTA: The Greater Toronto Area 主播AnnatarHe: https://annatarhe.comPhiloTK Timeline00: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...

SP03 杭州上海见

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

EP31 [WebWorker] OpenAI 和 Github 又有什么新活?

本期是 #2023 技术播客节 的一期节目。主要是和 WebWorker 播客联动一起畅聊 AI, Copilot, Next.js 与跨端技术，内容较长但是也同样比较有趣。欢迎大家也一起听一听 WebWorker 的节目若有其他任何意见建议欢迎发邮件联络: [email protected] 金句刚刚说 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.comWebWorker: https://podcast.webworker.tech/辛宝:...

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

本期节目主要以 next.js 的 Server component 和 Server action 为主题聊了一些 @AnnatarHe 自己的看法。总得来说，next.js 这波做得有点儿过了，但是也是发展的大方向。嘲笑之余，还是得学学。 主播AnnatarHe: https://annatarhe.com Timeline00:18 next.js 与 use php01:05 React 最近最大的变化是 Server Component02:00 前端多年来的进化 - 复杂是不可避免的03:06 之前的 SSR 只是为了 SEO, 新的 Server Component 并不一样04:30 更为极端的 Server Action 也来了06:16 Server Action 在嘲笑之余，是有很严肃的场景 ——...

EP29 装上 Zod 没有 Bug

Shownotes本期节目主要介绍了运行时的校验以及它的一个实现 —— Zod.在越来越大的项目中，运行时校验是逃不开的一个环节，可以应用在表单校验，API 返回值校验和后端的参数校验中。如果你的项目多人协作但是还没有接入类似的功能，可以考虑加一下，降低一些 bug 率如果对节目有任何意见或者建议，欢迎联系 [email protected] 名词解释 Runtime: 运行时，运行中的情况CI: 持续集成，简而言之，build & test 放到独立的服务器去做Lint: 代码校验，规范协作情况下代码统一 主播AnnatarHe: https://annatarhe.com Timeline00:20 最近意识到 zod 蛮有趣的00:50 大型项目协作的问题02:30 Runtime 检查的必要性03:20 Zod 的优势04:30 应用场景 —— 表单校验06:10 应用场景 —— API 校验07:50 应用场景 —— 后端 HTTP 参数校验09:10 Zod 实用小技巧 —— Infer09:50 Zod 实用小技巧...

EP28 这次咱肯定全栈了 - React Server Component

React Server Component 是最近的大事。本期蹭一次热点，锐评 RSC 和 Next.js。做前端的朋友们，这次，必须得学后端了哦。本期内容比较追热点且较为主观。如果有任何想法或者意见也欢迎留言或者邮件交流: [email protected] 主播AnnatarHe: https://annatarhe.com Timeline00:30 Server Component 是 React 又一个巨大 feature00: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...

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

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

EP26 那些无疾而终的技术项目们

最近 AnnatarHe 接了 next.js 的 App dir 出了一些问题，由此想到了一些无疾而终的项目。本期节目主要从这些虎头蛇尾的项目中探讨- 技术选项怎么能不被 “骗”- 项目靠暴力营销能行吗 大家有什么想聊的想说的，或者对节目有什么意见或者建议欢迎发邮件到 [email protected] 另外，其实还想说 Tengine 但是查了下 commit， 一年里还是有两三次 commit 的，饶过它了 主播AnnatarHe: https://annatarhe.com Timeline00:20 从 next.js 的 app directory 画的饼谈起03:25 翻翻 Vercel 的旧账 —— next.js 的类型问题, swc 编译出错04:50 Mongo 当年营销很猛06:05 某大厂虎头蛇尾项目集锦 - weex07:48 某大厂虎头蛇尾项目集锦 -...

EP25 还有没有新的花活？WASM, web container & NodeBox

Hi, 大家劳动节快乐～新一期的 AsyncTalk 从 Web Container 与 NodeBox 开始，探讨 Web Assembly 的发展与目前的状态，结论是虽然这些相关的产品在 AnnatarHe 看来前景并不乐观，但是 Web Assembly 技术已然成熟，可以尝试参与到我们的业务中，提升用户体验与性能。11:20 部分的英文是 code reusable 不是 code review 主播读音有问题 � 主播AnnatarHe: https://annatarhe.com Timeline00:25 主题: web assembly01:10 web assembly 的概述 —— 语言无关，性能，安全03:24 这东西真的有用？！03:40 Web Container05:02 NodeBox06:30 web assembly...

EP24 龙哥锐评 Rspack，开源与新加坡生活

本期节目成功拉到子龙和大家一起从 Rspack 开始，探讨开源和 ChatGPT，也有一些新加坡的生活。有任何意见或者建议请联系 [email protected] 主播AnnatarHe: https://annatarhe.com嘉宾子龙/龙哥 Timeline00: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...

EP23 让拉数据，像呼吸一样自然

本期节目主要介绍了请求数据时常遇到的问题以及React框架下的几种解决方案。最后,我们将介绍本期的主角React Query,包括它的设计和功能。如果有任何意见和建议可以发邮件至 [email protected]如果愿意加入我们的 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 仅限于 GraphQL09:30 SWR10:30 SWR 翻页数据有想法12:11 React Query13:23 Mutation 的支持14:10 对 TypeScript 的支持较好14:40 不要 debounce 了，直接取消请求吧16:29...

EP22 Code is cheap, let’s talk

前期准备不太充分，节目中有些内容没有表达出来。一个是我们在做库或者框架的时候，要有一个特点，更重要的是要有设计哲学。第二点忘记推荐 unix philosophy，非常精彩。第三点忘记对比几种设计哲学了，设计思想之间的碰撞非常有意思。在很多时候，软件工程的设计是一个 trade off 的过程。如果我们想要 clickhouse 那样超强的写入计算，那么事务就很难加入进去。迷茫的时候，这些哲学思想可以帮助我们走出困境，设计出更好的 API，提供更好的开发体验，优化出更好的性能。节目中没有提到的可维护性也是非常重要的一点，尤其在这样降本增效的大背景下，运营维护成本也不容忽视。最后，还是节目中提到的，所有的设计哲学的前提是要有基础的能力。千万不能只会拼凑名词，夸夸其谈。一定要先写好代码 有任何意见或者建议，可以联系我们 [email protected] 主播AnnatarHe: https://annatarhe.com Timeline 00:44 更新频率又更新了01:20 今天的主题 —— Code is cheap, let’s talk02: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-overviewReact...

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

本期节目讨论了一些 GraphQL 相关的内容。介绍 GraphQL 的发展，优势，缺点以及对应的一些解决方案。 有问题可以联系 [email protected] 主播AnnatarHe: https://annatarhe.com Timeline00:14 没有听众群，刷题和 chatGPT02:30 首富不懂 GraphQL?04:30 介绍 GraphQL 以及为什么有用10:50 GraphQL 的发展，应用，变种16:25 有谁在用 GraphQL17:40 GraphQL 有什么优势 —— 沟通成本降低，类型更加健壮，前端缓存更好做18:49 GraphQL 有什么缺点? —— 学习成本较高，后端性能不好控制，过度请求20:40 缺点的解决方案有哪些 —— 学，做性能追踪，做 query 管理服务27:30 关于 Cache30:00 安利 —— 快试试 GraphQL ! 相关链接首富吐槽 Twitter 慢是请求比较多....

EP20 TurboPack 卷起来了

本期节目我们来蹭一下 Turbopack 的热点，谈了一些关于 packer 相关的变化。那么假如听众你要来做一个新的 packer，你会怎么设计呢？本期用了新软件剪辑，也许有很多问题，听众有问题可以直接留言或发邮件。节目内容如有错误也请帮忙纠正，非常感谢～邮件地址： [email protected] 主播AnnatarHe: https://annatarhe.com Timeline00:00 介绍及团队说明00:42 Vercel 新的发布会与 Turbo pack03:40 天下苦 Webpack 久矣？为什么？06:10 Babel 也许并不是很好的选择07:10 也许语言也会拖慢 Webpack09:30 loader 们同样的事情做了很多次10:10 Vite 的赢面看起来挺大，Rome, Parcel 也不错13:22 Webpack 由于生态和兼容，大概还是会继续统治前端构建15:40 假如来做一个新的 packer, 会怎么做呢？19:15 听众你会怎么做呢？ 相关链接Turbopack 的 release tweet: https://twitter.com/vercel/status/1584961746418208774Is Turbopack really 10x Faster...

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

在又一次紧张刺激的停更后，我们和 Roc 一起谈了谈 side project 与独立开发的一些事情。主要包括为什么要做独立开发，收益如何，最后再打个绩效。希望大家可以 happy coding~ 有任何意见建议也欢迎联系我们: [email protected] 名词解释ROI: Return on Investment 投入产出比RD: Research & Development 本节目中多数意为 工程师/开发/程序员PM: Product Manager 本期节目中特指 产品经理 主播Roc: https://twitter.com/roczhang9673AnnatarHe: https://annatarhe.comSleaf: https://twitter.com/Sleaf_ Timeline 00:33 Roc 与停更的说明01:40 独立开发一般做点儿什么 App ?03:20 Roc 做的一些 App07:50 为啥不太高兴做 Android ?11:20 完全不上班，靠卖 App 生活现实吗 ?14:30 除开资金，还会有什么其他收益 ?25:30 Sleaf 与...

EP18 “差生”文具多 - 软件

第 18 期几位主播聊了一些关于我们自己日常用的编辑器，插件和 App。如果有什么好用的东西也可以评论或者留言给我们哦: [email protected] 主播AnnatarHe: https://annatarhe.comSleaf: https://twitter.com/Sleaf_Tinko: https://space.bilibili.com/290664小鹿 Timeline00:40 编辑器，IDE 与插件09:05 开发相关的一些 App 也很好用～18:00 Atom —— 时代的眼泪 相关链接Jetbrains’ Free Educational License: https://www.jetbrains.com/community/education/#studentsEmmet: https://emmet.io/VS Code Remote Development: https://code.visualstudio.com/docs/remote/remote-overviewGitLens: https://marketplace.visualstudio.com/items?itemName=eamodio.gitlensrust-analyzer: https://marketplace.visualstudio.com/items?itemName=rust-lang.rust-analyzerAnnatarHe 的 vimrc 配置: https://github.com/AnnatarHe/vim-configEmacs Evil mode: https://github.com/emacs-evil/evilAlfred: https://www.alfredapp.com/uTools: https://www.u.tools/raycast: https://www.raycast.com/Xcodes.app: https://github.com/RobotsAndPencils/XcodesAppNetNewsWire: https://netnewswire.com/reeder app:...

EP17 “差生”文具多 - 开发工具

第 17 期几位主播聊了一些关于我们自己日常用的一些 Terminal, Shell 和命令。如果有什么好用的东西也可以评论或者留言给我们哦: [email protected] 主播AnnatarHe: https://annatarhe.comSleaf: https://twitter.com/Sleaf_Tinko: https://space.bilibili.com/290664小鹿 Timeline01:17 入题：差生文具多01:22 Terminal10:18 Shell14:20 命令23:30 结语，还有下一集哦 相关链接 iTerm2: https://iterm2.com/Dracula Theme: https://draculatheme.com/tmux: https://github.com/tmux/tmux/wikiPowerline fonts: https://github.com/powerline/fontsMaple Mono font: https://github.com/subframe7536/Maple-fontWarp Terminal: https://www.warp.dev/tldr: https://github.com/tldr-pages/tldrthefuck: https://github.com/nvbn/thefuckhyper.js: https://hyper.is/putty: https://www.putty.org/Microsoft terminal: https://github.com/microsoft/terminalZsh: https://www.zsh.org/oh my zsh: https://ohmyz.sh/fish shell: https://fishshell.com/oh my fish:...

EP16 定宽容器长文本缩放

本期从一个问题开始如何在一个定宽 div 中展示一个可能会略长一些的文本在探索方案的同时，我们也聊了一些关于如何提问可以更有效地获取答案的方式。 有任何问题可以邮件或评论区联系： [email protected] 主播 AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_小鹿 Timeline01:00 问题起因，如何在定宽文本中放入文本08:00 质疑需求16:16 提问的智慧 相关链接 Letter spacing: https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacingMarquee tag: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/marqueehtml2canvas: https://www.npmjs.com/package/html2canvasCanvas.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

EP15 前端的状态管理

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

EP14 bun 新生煎出炉啦

这期节目我们追一追时下比较火的 bun — a fast all-in-one JavaScript runtime 来听听主播们都看了点儿什么。节目中有任何问题，意见或者建议均可邮件联系： [email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664小鹿 节目中提到的 fib 代码如下： 运行结果如图： Timeline:0:54 最近新出了个 bun3: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 computing21:03 阿里前端近年来风评问题23:15...

EP13 浏览器最近的新功能

第二季的开始我们先从浏览器近几年出的 API 谈起，聊一聊浏览器能多做些什么联系我们： [email protected] 主播 AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_ Timeline 00:30 新一季想多聊聊新东西02:05 monaco 做得不错~02:55 Permission03:53 新的 API 好像大多需要 HTTPS 了05:00 Local Notification & Push Notification08: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/notificationFirebase: https://firebase.google.com/clipboardjs: https://clipboardjs.com/Clipboard API: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_APISelection API: https://developer.mozilla.org/en-US/docs/Web/API/SelectionexecCommand...

SP2 第一季结束啦

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

EP12 官网与 SEO

在节目进行到第 12 期的时候，我们终于写了个自己的官网。以此为契机聊了一些 SEO (搜索引擎优化) 相关的话题 联系我们： [email protected] 关键名词：SEO: Search Engine OptimizationCSR: client side rendering - 客户端渲染SSR: server side rendering - 服务端渲染Nextjs: 一个支持 SSR 的 React 框架 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_小鹿 Timeline0:00 开场0:19 我们写了个官网1:02 什么是 SEO3:42 搜索引擎是怎么看网页的15:00 OpenGraph 是个好东西18:37 有些网站其实不想被爬21:30 ...

EP11 与 Event 斗争的血泪史

本期节目主播们在谈天说地之余聊了些关于 Event 相关的话题，从浏览器事件模型到性能优化都没丢下。由于 lock down 带来的影响尚未散去，主播们普遍未能恢复到完全的状态，本期节目还请大家多多包涵。但如果内容有误请务必不要照顾我们，可以通过邮件或者直接评论留言的方式联系我们指正。感谢～邮件：[email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_小鹿 Timeline0:48 引题 - Event1:24 Event 是什么5:11 浏览器事件模型9:10 AbortSignal 与 once10:58 浏览器生命周期事件14:35 I'm not robot!17:47 event.target & currentTarget18:47 无聊的面试题：事件委托20:39 不是面试题的 Event Loop23:51 Node Event Loop 以及你为啥不该知道32:08 脱离前端的 Event32:38 Event 有啥用呢？挣钱，解耦33:56 ”事件“ 概念的杰出代表 —...

EP10 出海，国际化

本期节目我们请到了一位强力外援 李叶(https://github.com/leeyeh/) 来一起谈一谈出海国际化的各种问题。这期节目只有大概一小时，但是内容却相当丰富，谈及了语言，数字及文化方面的国际化注意事项及一些解决方案。最后发现还是做国内市场最简单 :) 主播:李叶: https://github.com/leeyeh/AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: 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...

EP09 大哥大嫂过年好，一起聊聊样式表

大家新年快乐~我们年后回归一起聊一聊 CSS 。主要介绍了几种 css 工程的思想及相关实现的代表作，探索更好的 CSS 工程形式。有任何意见或建议，欢迎联系邮件：[email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_小鹿 Timeline00:30 听众反馈02:43 让人头疼的样式表13:02 预编译器哪家强22:38 怎么限制 css 作用域？25:21 BEM？简单而臃肿28:03 Vue 送来了 scoped30: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:...

EP08 金三银四，来场面试(下)

第七期内容我们趁着年前各位跳槽前录了期关于面试的话题，包括了面试官和候选人的视角。也谈到了应该用什么样的态度来面试，问什么问题，也包含最后的薪酬话题。其中关于 “面试造火箭，入职拧螺丝” 的部分我们讨论比较激烈，但内容上是关于 “预期管理” 的讨论。后续也激烈讨论了老生常谈的 “性能 vs 效率“ 的话题。听众有自己的看法也欢迎留下评论或者发邮件讨论。由于本期内容过长，我们分了上、下两集。同时春节临近，我们也请假一期。下次更新时间是 2022.2.24 祝大家新年快乐~联系方式： [email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: 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 面试题 —— 实现 deepclone06:44 面试题...

EP07 金三银四，来场面试(上)

第七期内容我们趁着年前各位跳槽前录了期关于面试的话题，包括了面试官和候选人的视角。也谈到了应该用什么样的态度来面试，问什么问题，也包含最后的薪酬话题。其中关于 “面试造火箭，入职拧螺丝” 的部分我们讨论比较激烈，但内容上是关于 “预期管理” 的讨论。后续也激烈讨论了老生常谈的 “性能 vs 效率“ 的话题。听众有自己的看法也欢迎留下评论或者发邮件讨论。由于本期内容过长，我们分了上、下两集。同时春节临近，我们也请假一期。下次更新时间是 2022.2.24 祝大家新年快乐~联系方式： [email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: 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 面试题 —— 实现 deepclone06:44 面试题...

EP06 Low Code 到底 Low 不 Low

本期节目我们终于蹭上了热点 —— 低代码(Low Code)。主播们根据自己的经历谈了些应用场景和实现等相关话题，展望未来的低代码平台应该是什么样子。希望能对听众在构建自己的低代码平台时有一定的启发。联系我们： [email protected] 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: 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...

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

️ 本期三位主播围绕 "包管理" 聊了些 js 的包管理历史，版本管理，如何发包等问题。联系我们： [email protected] �‍�‍� 主播AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf: https://twitter.com/Sleaf_ ⏰  Timeline00:00 开场简介01:52 JavaScript 包管理历史07:48 包管理是用来解决什么问题的10:47 版本管理13:50 包管理器的百家争鸣17:53 .lock 文件即版本号的设计24:12 how to patch a package27:00 发个包吧28:40 package.json 的字段有哪些37:57 type: module41:10 npm scripts45:30 npm link & tag & publish51:41 总结以及开发一个新包应该有哪些注意事项 � 勘误Rust...

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

本期我们邀请到了子亭(@jysperm)来和我们一起聊一聊 node.js 及相关的后端和全栈概念。也欢迎大家留下自己对话题的看法及节目的评价。感谢各位的收听。联系我们： [email protected] 主播：AnnatarHe: https://annatarhe.comTinko: https://space.bilibili.com/290664Sleaf 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-valuesDesign Doc: Use JavaScript instead of TypeScript for internal...

EP03 工程师的自我修养 - 前端的工程化

为了达成 OKR 聊点儿主题相关的，这次的主题是关于前端工程化的问题，以及对未来的展望，如何身体力行地去参与创建下一代前端。 内容主要三个部分 —— 开发，部署，运维 希望大家可以开拓视野，尝试用初次相见的眼光看待事物，不拘泥于目前的限制。毕竟比马更快的不是马，比 TNT 更爆裂的也不是炸药。那么，比 React, Webpack 更好的，是什么呢？ 主播：AnnatarHe: https://web.okjike.com/u/20965c29-1f92-4df8-9107-45043db29278Tinko: https://space.bilibili.com/290664Sleaf Timeline:00:00 开场01:03 前端工程化的前世今生05:05 现代工程化 - 开发（分支管理与 Git Flow）12:36 当前部署流程 CI/CD14:32 下一代构建/部署展望23:10 下一代的 CSS 样式要怎么写？31:55 我们需要更高压缩率的图片格式吗？38:07 关于测试的讨论46:25 下一代运维是什么样，Serverless？52:28 上线之后我们要做什么？56:37 畅想重构 web...

EP02 又不是不能用 - 跨平台方案

EP01 学前端的入门问题

在社交媒体上看到一位朋友发的牢骚，内容是这样的： 想学一种前端技术，毕竟自己对产品还是也很喜欢的，想着是不是自己也能瞎搞点啥，然后就去搜：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 结论小结主播：SleafHTinko: tinko@bilibiliAnnatarHe: AnnatarHe联系方式： [email protected]注：由于收音问题，请在 21:50 左右加大音量，后期我们会尝试改进Ref:《JavaScript DOM 编程艺术》https://book.douban.com/subject/6038371/《JavaScript 高级程序设计》（红皮书）: https://book.douban.com/subject/10546125/《JavaScript...

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

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