国内
清华大学 - 十大变革科技
清华大学《探臻科技评论》发布了2023年“青年最关注的改变未来十大变革科技”榜单,包括超快激光加工、第六代移动通信技术、第四代半导体材料、动力电池回收技术、高温超导材料、类脑计算、类器官芯片等。类器官芯片是一种新型的仿生人体体外模型,具有颠覆性的医药行业技术。生物3D打印技术是一种利用干细胞作为墨水的新型3D打印技术。生物质能碳捕集与封存是一种减缓气候变化的负排放技术。通用人工智能是一种利用数据算法助力科研范式变革的技术。
淘宝 - 双十一 AI 应用
在过去的第15个天猫双11中,淘宝成为了新的“AI淘宝”,通过融合大模型和AIGC文生图等技术路线,提供更好的消费体验。AI技术在电商领域的应用意义重大,不仅用于企业内部流程,还面向买家和卖家两种不同需求的终端用户。淘宝天猫技术团队通过解决“幻觉问题”来提高大模型回答的准确性和丰富性。淘宝天猫集团凭借其完整的电商行业数据、行业经验和规模化的AI产品,与终端用户建立了密切的关系。
美团 - 智能化异常检测
美团到店平台技术部/质量工程部与复旦大学计算机科学技术学院周扬帆教授团队展开了“基于UI交互理解的智能化异常检测方法”的科研合作,利用多模态模型对用户可见文本、视觉图像内容和UI组件树中的属性进行融合,实现了对于UI交互意图[1]的准确识别。该工作对于大前端UI的质量保障等多个领域都具有可借鉴的意义,介绍该工作的学术论文[2]已经被 ESEC/FSE 2023 (软件领域CCF A类推荐会议)接收,并将于12月6日在其工业届轨(Industry track)公开发布、推介。
字节 - Rsbuild
Rspack 0.4 发布,增强版 CLI Rsbuild 登场!
Rspack 0.4发布了,其中引入了增强版的CLI工具Rsbuild。Rsbuild是基于Rspack的构建工具,旨在提供更容易上手和开箱即用的功能。它可以帮助减少90%的配置,并获得10倍的构建速度。Rsbuild的构建性能与原生Rspack相当,但由于内置了更多开箱即用的功能,性能数据可能略低于Rspack。Rsbuild具有易于配置、性能优先、插件生态、产物稳定和框架无关等特性。它集成了基于Rust的高性能工具,提供了5~10倍的构建性能和更轻量的依赖体积。Rsbuild还内置了一个轻量级的插件系统,兼容大部分的webpack插件和所有的Rspack插件。它的开发环境产物和生产构建产物具有较高的一致性,并提供插件来进行类型检查和语法检查。Rsbuild不与前端UI框架耦合,并通过插件来支持多个框架。未来计划引入更多强大的新特性,如构建分析工具Rsbuild Doctor。Rspack 0.4的主要变动包括停止支持Node.js 14,调整@rspack/core为@rspack/cli的peer dependency,以及废弃默认转换等。
字节 - React
本文介绍了三种解决React组件定位源码的方案,分别是使用Chrome的React Developer Tools插件、使用Chrome插件React Inspector和locatorjs、使用react-dev-inspector npm包。这三种方案都可以提高开发效率。
腾讯 - GPTs
本文介绍了如何使用不到50行的Python代码调用自己在ChatGPT创建的私有GPTs,并介绍了使用playwright库进行浏览器自动化操作的示例代码。文章还提到了使用playwright开发智能网页机器人应用时遇到的用户验证问题,并给出了两种解决思路。最后,文章介绍了使用Playwright库调用远程私有GPTs的示例代码的介绍。
腾讯 - AI Agent
AI Agent是一种具备自主理解感知、规划、记忆和使用工具能力的系统,以大语言模型为大脑驱动。智能体模式是一种人机协同的方式,通过智能体的记忆、规划、行动和使用工具四个主要模块的功能,使智能体能够在更广泛的情境中采取行动和作出决策,以更智能、更高效的方式执行复杂任务。AI Agent将改变软件的游戏规则,将软件架构的范式从面向过程迁移到面向目标。未来的软件生态将围绕Agent来改变,不仅是最上层与所有人交互的媒介是Agent,整个产业的发展,包括底层技术、商业模式、中间组件以及人们的生活习惯和行为都会围绕Agent来改变,开启Agent-Centric时代。未来工作中的一个重要挑战是人类与智能体之间的竞争。
得物 - 微前端
本文介绍了得物技术在推进效率前端微应用中,微前端研发效率所面临的挑战和解决方案。文章列举了微前端研发过程中的费力点,并介绍了技术调研中的解决方案。最后,文章总结了推进情况,包括项目覆盖率、研发效率和用户反馈。
大模型基础科普
“大模型本质就是两个文件!”特斯拉前AI总监爆火LLM科普,时长1小时,面向普通大众
特斯拉前AI总监Andrej Karpathy录制了一段时长为1小时的科普视频,介绍了大语言模型的相关知识。视频上线仅1天就已经有20万播放量,网友对其内容和教学风格给予了高度评价。视频中,Andrej解释了大模型的概念,指出大模型本质上是由参数文件和代码文件组成的。参数文件是神经网络的权重,代码文件用于运行神经网络。他还介绍了大模型的训练过程,需要使用巨大的GPU集群对互联网数据进行有损压缩。训练完成后,大模型可以通过神经网络对给定序列中的下一个单词进行预测。然而,由于训练是有损压缩的,大模型给出的结果并不能保证100%准确。Andrej还介绍了微调的过程,强调质量大于数量,通过人工精心挑选和标记的对话来进行微调。最后,他总结了训练自己的ChatGPT的流程,并介绍了大模型将成为新的操作系统的趋势。
转转 - 通用筛选组件
转转通用筛选组件是为了解决转转/找靓机双卖场各场景筛选的前端展现样式、交互、筛选内容不一致的问题而设计的。在技术背景方面,转转搜索推荐侧提供的schema数据是一套由平台侧与搜索侧积累了多年的配置筛选视图与关系控制的数据结构体系。在整体设计方面,采用了传统的SFC(Single File Component)组件方式进行设计实现,并进行了分层设计,包括数据层、服务层和视图层。在主要能力实现方面,对数据模型进行了原子拆分,包括基础业务数据模型、style体系元数据模型、搜索交互缓存模型、定位数据模型、机型模型和埋点数据模型。此外,还有Service层负责服务端数据获取和Model层负责model的初始化、转换、增删改查等。这段文本详细介绍了数据模型分层、筛选项平铺更新算法、筛选组件与搜索框组件的联动以及组件的自动吸顶与滚动等内容。
百度 MEUX
百度商业B端平台的列表模块存在性能卡顿和交互操作效率低的问题,通过全屏交互框架、创新设计交互模式和增加智能查询等举措提升列表使用体验和客户满意度。针对浏览数据场景,采用全屏沉浸模式和紧凑型UI方案提高展现行数和空间利用率。针对查找数据场景,提出组合筛选交互模式和智能查询功能。针对管理数据场景,提供多任务标签卡的交互模式。通过以上措施,希望提升列表模块的操作效率和客户满意度。
腾讯 ISUX
本文介绍了一系列与设计和科技相关的新闻和趋势。其中包括Telegram增强回复消息的能力、Google推出自动生成广告工具、YouTube测试聊天机器人YouChat、Windows 11发布重磅更新、Meta开发沉浸式社交聊天机器人、方正字库发布2023字体趋势报告等内容。
设计 - 列表卡片
列表卡片是一种将列表和卡片相结合的组件形式,适用于内容不需要排序和需要明确排序的情况。列表卡片的内容元素包括标题、列表、卡片背景和查看详情的按钮。序号设计是有序列表卡片中的一个重要设计点。
国外
AI Frontend
Combining AI with React for a Smarter Frontend
本文讨论了在React应用中集成人工智能技术的方法和技术。作者建议使用Next.js作为技术栈的基础,并与OpenAI的Chat GPT和GPT进行连接。作者还提到了LangChain作为技术栈的关键部分,以及使用MongoDB和MongoDB Atlas Vector Search来存储向量嵌入。通过结合这些技术,可以实现更智能、更强大的React应用。
CSS
An Interactive Guide to CSS Grid
CSS Grid是CSS语言中最令人惊叹的部分之一,它为我们提供了许多新工具,可以用来创建复杂而流畅的布局。然而,CSS Grid也是令人惊讶地复杂。本教程将分享我在学习CSS Grid过程中的一些重要的心灵瞬间,您将学习到这种布局模式的基本原理,并看到如何使用它来实现一些很酷的效果。
Getting started with CSS container queries
来自 MDN Blog,介绍如何使用容器查询。
本文介绍 CSS 嵌套,该特性已经被所有主流浏览器所支持。