{"pageContext":{"index":4,"total":364,"name":"2019-06-02","items":[{"node":{"frontmatter":{"title":"756 个有趣的公开免费数据集","publish":true,"cover":"","showCover":true,"date":"2019-06-01","category":"database","url":"https://docs.google.com/spreadsheets/d/1wZhPLMCHKJvwOkP4juclhjFgqIY8fQFMemwKL2c64vk/edit#gid=0","author":"Data Is Plural","translator":"","tags":["dataset"],"priority":1},"html":"

例如昆汀的电影里的领盒饭的角色

"}},{"node":{"frontmatter":{"title":"16个Devtools技巧","publish":true,"cover":"","showCover":true,"date":"2018-11-20","category":"frontend","url":"https://www.heartinternet.uk/blog/16-devtools-tips-and-tricks-every-css-developer-need-to-know/","author":"Louis Lazaris 摘译 Ka","translator":"","tags":["devtools"],"priority":1},"html":"

摘录部分：

\n

F8暂停以获取动态展示的元素

\n

CTRL-SHIFT-O查找css源码

\n

打开一个css文件,按CTRL-SHIFT-O\n

\n

切换颜色格式

\n

\n

调试阴影

\n

\n

火狐的Grid布局查看器

\n

\n

火狐的滤镜编辑器

\n

\n

Chrome的动画编辑

\n

在三个圆点菜单处选择more tool/Animations\n

\n

Chrome查看未使用的样式

\n

在三个圆点菜单处选择more tool/Coverage

"}},{"node":{"frontmatter":{"title":"MIT 最新研究：只听 6 秒语音，就知道说话者长相","publish":true,"cover":"","showCover":true,"date":"2019-05-28","category":"python","url":"https://constatic.geekbang.org/infoq/5ceb8707f3633.png?imageView2/0/w/800","author":"MIT CSAIL","translator":"","tags":["Machine Learning"],"priority":1},"html":"

MIT 使用了 AVSpeech 数据集，它由来自 YouTube 的数百万个视频片段组成，有超过 10 万人的语言数据。Speech2Face 是通过自我监督的方式训练的。

\n
\n

当然，目前效果还很不可靠。

\n
"}},{"node":{"frontmatter":{"title":"2019 年，互联网企业起薪最高，数据科学家岗位薪资排第一","publish":true,"cover":"","showCover":true,"date":"2019-05-29","category":"misc","url":"https://www.infoq.cn/article/ctPIg1VwhOggJIk-7CVT","author":"Amanda Stansell 译者 王强","translator":"","tags":["salary"],"priority":1},"html":"\n

如今美国就业形势喜人，是大学生和新毕业生进入劳动力市场开始职业生涯的好时机。由于失业率处于历史最低水平且工作需求不断增加，求职者在市场上处于主导地位，雇主愿意为需求高而供应短缺的职位和技能支付高额报酬。

"}},{"node":{"frontmatter":{"title":"Papa Parse 5.0发布","publish":true,"cover":"","showCover":true,"date":"2019-05-10","category":"frontend","url":"https://github.com/mholt/PapaParse","author":"Matt Holt","translator":"","tags":["csv"],"priority":1},"html":"
//解析字符串\nPapa.parse(csvString[, config]);\n\n//解析本地文件 参见FileReader\nPapa.parse(file, config)\n\n//解析远程文件\nPapa.parse(url, {\n\tdownload: true,\n\t// rest of config ...\n});\n\n//json转csv\nPapa.unparse(data[, config]);
"}},{"node":{"frontmatter":{"title":"Deepfake 盛行背后：合成数据到底有什么用？","publish":true,"cover":"https://constatic.geekbang.org/infoq/5ceaa8d5b7e2d.png?imageView2/0/w/800","showCover":true,"date":"2019-05-29","category":"python","url":"https://www.infoq.cn/article/TWe-q9gupK4CSlshG7GB","author":"Astasia Myers 译者 Sambodhi","translator":"","tags":["Machine Learning"],"priority":1},"html":"

像 Google 这样的大公司拥有大量难以突破的数据护城河。今天，正在捕获数据的公司正在以手工的方式标记数据，这可能是缓慢的、昂贵的和低质的方式。如果使用合成数据的话，就可以帮助公司绕过这些限制，使数据民主化。

\n

可以使用 Unreal、Blender 和 Unity 等游戏引擎以编程方式来创建合成数据。

\n

域随机化通过以非真实感的方式，随机干扰环境，有意放弃照片级的真实感，迫使网络学会专注于图像的基本特征。

\n

由于合成实体数据可以删除姓名、电子邮件、社会安全号码等信息，但仍然能够反映出基础数据集，因此受到了隐私问题的推动。这有助于数据科学家在不访问敏感信息的情况下进行实验。

"}},{"node":{"frontmatter":{"title":"VS Code 的全栈 Web 模板 WebTemplateStudio","publish":true,"cover":"","showCover":true,"date":"2019-05-17","category":"nodejs","url":"https://www.oschina.net/p/webtemplatestudio","author":"xplanet@OSCHINA","translator":"","tags":["vscode"],"priority":1},"html":"

项目类型：目前只支持一种类型：Fullstack 应用程序。\n框架：目前支持一个前端框架：React.js，和一个后端框架：Node.js。\n应用页面：当前页面模板包括：空白页面、公共布局和实现常见模式的页面（例如网格或列表）。\n云服务：当前支持的服务包括存储（Azure Cosmos DB）和计算（Azure 功能）。

"}},{"node":{"frontmatter":{"title":"Segment 放弃了微服务","publish":true,"cover":"","showCover":true,"date":"2019-05-27","category":"devops","url":"https://www.infoq.cn/article/v3VjP*BYtY3qhD3438ay","author":"Alexandra Noonan 译者 平川","translator":"","tags":["microservice"],"priority":1},"html":"

2017 年初，Segment 的一个核心产品达到了一个临界点。这就像我们从微服务的树上掉下来，并在下落的过程中砸到每根树枝一样。小团队没有让我们更快地前进，相反，我们发现自己陷入了复杂性爆炸的泥潭。这种架构的基本好处变成了负担。我们的速度急剧下降，我们的缺陷率却呈现爆炸式增长。

\n

从单代码库-》多代码库+共享代码库-》再回到单代码库。主要是还是基于运维的原因。

\n

一旦所有目标的代码都存在于一个代码库中，就可以将它们合并到一个服务中。由于每个目标都存在于一个服务中，我们的开发人员的工作效率得到了显著提升。我们不再需要因为变更一个共享库而部署 140 多个服务。一个工程师可以在几分钟内完成服务部署。

\n

从微服务架构到整体的单体架构是一个巨大的改进，但是，也有一些妥协：

\n

故障隔离很困难。由于所有内容都在一个整体中运行，如果在一个目标引入了导致服务崩溃的 Bug，那么所有目标服务都会崩溃。我们有全面的自动化测试，但测试有其局限性。我们目前正在研究一种更加健壮的方法，以防止一个目标使整个服务宕掉，同时又保持所有目标都在一个单体中。

\n

我们需要一个健壮的测试套件，把所有的东西都放在一个代码库中。如果没有这个，我们就会和当初决定把它们分开时一样。

"}},{"node":{"frontmatter":{"title":"PostGIS 3并行查询不再需要额外配置","publish":true,"cover":"https://blog.cleverelephant.ca/images//2017/parallel_4.jpg","showCover":true,"date":"2019-05-30","category":"database","url":"https://blog.cleverelephant.ca/2019/05/parallel-postgis-4.html","author":"Paul Ramsey","translator":"","tags":["postgres"],"priority":1},"html":"

PostgreSQL 12 and PostGIS 3 并行空间查询不再需要额外的配置。

\n

包括三种查询处理

\n\n

只需要增加你的计算处理内核(core)的数量。

\n

此改进是由于加入了优化了核心空间查询功能实现。

"}},{"node":{"frontmatter":{"title":"W3C与WHATWG协同推进开放Web平台建设","publish":true,"cover":"","showCover":true,"date":"2019-05-28","category":"frontend","url":"https://www.chinaw3c.org/blog-w3c-and-whatwg-to-work-together-to-advance-the-open-web-platform.html","author":"chinaw3c","translator":"","tags":["w3c"],"priority":1},"html":"

W3C CEO Jeff Jaffe：我在此高兴地宣布 W3C 与 WHATWG 经过协商现最终签署了一份《合作备忘录》作为双方认可合作模式，继而共同开发相同的 HTML 与 DOM 规范。

"}},{"node":{"frontmatter":{"title":"Zdog-基于canvas的伪3d引擎","publish":true,"cover":"","showCover":true,"date":"2019-05-28","category":"frontend","url":"https://github.com/metafizzy/zdog","author":"Metafizzy","translator":"","tags":["3d"],"priority":1},"html":"

目前看到的是代码创建模型，不能导入3d模型？

"}},{"node":{"frontmatter":{"title":"dbkoda-开源mongo GUI客户端1.1发布","publish":true,"cover":"https://www.dbkoda.com/assets/images/art/screen-09.jpg","showCover":true,"date":"2019-05-29","category":"database","url":"https://www.dbkoda.com","author":"Southbank Software","translator":"","tags":["mongo"],"priority":1},"html":"

试用了一下，样子很酷，有以下问题:

\n\n

感觉还是不如 ROBOT 3T

"}},{"node":{"frontmatter":{"title":"mongo atlas现在也支持Azure和GCP的私有虚拟网络","publish":true,"cover":"","showCover":true,"date":"2019-05-14","category":"database","url":"https://www.mongodb.com/blog/post/atlas-mapped-private-network-peering-on-azure--gcp","author":"Leo Zheng","translator":"","tags":["mongo"],"priority":1},"html":"

至此 Atlas 支持 AWS,Azure,GCP 三个平台的私有虚拟网络。

"}},{"node":{"frontmatter":{"title":"mongo 的数组 schema 定义","publish":true,"cover":"","showCover":true,"date":"2019-05-10","category":"database","url":"https://www.mongodb.com/blog/post/json-schema-validation--checking-your-arrays?elqTrackId=d302f93c945d4d07b7b73ad4cd3eeab1&elq=73c3b8ce386d43e99efdb4f8829681cd&elqaid=8398&elqat=1&elqCampaignId=11890","author":"Ken W. Alger","translator":"","tags":["mongo"],"priority":1},"html":"

见下面示例的dyes字段

\n
db.foodColor.drop()\ndb.createCollection ( \"foodColor\",\n{\n    validator:\n    {\n        $jsonSchema:\n      {\n        bsonType: \"object\",\n        required: [\"name\", \"box_size\", \"dyes\"],\n        properties:\n        {\n            _id: {},\n            name: {\n                bsonType: [\"string\"],\n                description: \"'name' is a required string\"\n            },\n            box_size: {\n                enum: [3, 4, 6],\n                description: \"'box_size' must be one of the values listed and is required\"\n            },\n            dyes: {\n                bsonType: [\"array\"],\n                minItems: 1, // each box of food color must have at least one color\n                uniqueItems: true,\n                additionalProperties: false,\n                items: {\n                    bsonType: [\"object\"],\n                    required: [\"size\", \"color\"],\n                    additionalProperties: false,\n                    description: \"'items' must contain the stated fields.\",\n                    properties: {\n                        size: {\n                          enum: [\"small\", \"medium\", \"large\"],\n                          description: \"'size' is required and can only be one of the given enum values\"\n                                },\n                        color: {\n                          bsonType: \"string\",\n                          description: \"'color' is a required field of type string\"\n                                }\n                    }\n                }\n            }\n        }\n      }\n    }\n})
"}},{"node":{"frontmatter":{"title":"react hook循环检测工具","publish":true,"cover":"","showCover":true,"date":"2019-05-17","category":"frontend","url":"https://github.com/kentcdodds/stop-runaway-react-effects","author":"Kent C. Dodds","translator":"","tags":["react"],"priority":1},"html":"

react useEffect 和 useLayoutEffect都是在渲染之后触发，那么如果在这里面再次出发了渲染，就造成了递归。

\n

stop-runaway-react-effects可以在开发时检测这种问题。它是通过包装useEffect和useLayoutEffect来达到目的的。

\n
import {hijackEffectHook} from 'stop-runaway-react-effects'\n\nif (process.env.NODE_ENV !== 'production') {\n  hijackEffects()\n}
"}},{"node":{"frontmatter":{"title":"京东开源Alita: ReactNative对微信小程序转换工具开源","publish":true,"cover":"https://github.com/areslabs/alita/raw/master/docs/static/wxalita.gif","showCover":true,"date":"2019-05-29","category":"frontend","url":"https://github.com/areslabs/alita","author":"ARES Labs","translator":"","tags":["React Native"],"priority":1},"html":"

一套把 React Native 代码转换成微信小程序代码的转换引擎工具

\n
\n

目前文档还不算很详细。

\n
"}},{"node":{"frontmatter":{"title":"react-div-100vh解决手机浏览器100vh问题","publish":true,"cover":"https://raw.githubusercontent.com/mvasin/react-div-100vh/master/images/react-div-100vh.png","showCover":true,"date":"2019-05-30","category":"frontend","url":"https://github.com/mvasin/react-div-100vh","author":"Mikhail Vasin","translator":"","tags":["react"],"priority":1},"html":"

CSS3常见问题：100vh在移动浏览器中不是固定的，恒定的

\n

手机浏览器加载页面时,所有浏览器都有一个顶级菜单（例如显示地址栏），当您开始滚动页面时，该菜单会向上滑动。这个时候该菜单会变小，由于100vh仅在视口的可见部分计算，因此会导致所有布局都重新绘制并重新调整，对用户体验的糟糕跳跃效果。

\n

react-div-100vh的解决方案就是，监听resize事件动态修改样式。

"}},{"node":{"frontmatter":{"title":"使用picture不要使用background-image","publish":true,"cover":"","showCover":true,"date":"2019-05-28","category":"frontend","url":"https://nystudio107.com/blog/the-css-background-image-property-as-an-anti-pattern","author":"Andrew Welch 摘译 Ka","translator":"","tags":["edge"],"priority":1},"html":"

background-image 方式

\n
<div\n  style=\"background-image: url('/some/man-with-a-dog.jpg');\n            background-size: cover;\"\n></div>
\n

picture 方式

\n
<picture>\n  <img\n    src=\"/some/man-with-a-dog.jpg\"\n    alt=\"Man with a dog\"\n    style=\"object-fit: cover;\"\n  />\n</picture>
\n

注意object-fit: cover

\n"}},{"node":{"frontmatter":{"title":"在线grid布局生成器","publish":true,"cover":"https://camo.githubusercontent.com/12984818e7ee47c8a1afc3ca5d300834162703c4/68747470733a2f2f73332d75732d776573742d322e616d617a6f6e6177732e636f6d2f732e6364706e2e696f2f32383936332f6f672d637373677269642e6a7067","showCover":true,"date":"2019-05-14","category":"frontend","url":"https://cssgrid-generator.netlify.com/","author":"Sarah Drasner 摘译 Ka","translator":"","tags":["css"],"priority":1},"html":"

鼠标选择多个格子表示合并。\n一个格子点多次则会在此位置上生成多个div。

\n

问题：需要一个回退操作。

"}},{"node":{"frontmatter":{"title":"吵起来-Google强制Edge 预览版用户浏览Modern YouTube 时使用chrome","publish":true,"cover":"https://www.thurrott.com/wp-content/uploads/sites/2/2019/05/youtubeedge.jpg","showCover":true,"date":"2019-05-28","category":"misc","url":"https://www.thurrott.com/google/207371/google-now-forces-microsoft-edge-preview-users-to-use-chrome-for-the-modern-youtube-experience","author":"Mehedi Hassan 摘译 Ka","translator":"","tags":["edge"],"priority":1},"html":"

基于Chromium的微软新Edge浏览器的用户爆料：两天前使用google旗下youtube网站的“modern YouTube experience”还好好的，突然youtube告知不支持的浏览器，请下载chrome。

\n

然后就人们吵起来了！有说是个偶然bug，更多人倾向于认为google故意作恶。

\n

这意味着“从保守转向开放的微软”还是“从不作恶走向反面的谷歌”？

"}},{"node":{"frontmatter":{"title":"实时消息总线选择","publish":true,"cover":"","showCover":true,"date":"2019-05-28","category":"database","url":"https://www.datanami.com/2019/05/28/assessing-your-options-for-real-time-message-buses/","author":"Alex Woodie","translator":"","tags":["realtime"],"priority":1},"html":"

Apache Kafka

\n\n

Apache Pulsar

\n\n

RabbitMQ

\n\n

Apache ActiveMQ

\n\n

TIBCO Messaging

\n"}},{"node":{"frontmatter":{"title":"我放弃了成为一个全栈开发工程师的理想","publish":true,"cover":"","showCover":true,"date":"2019-05-29","category":"misc","url":"https://www.infoq.cn/article/girKQeiW9YXAt*k9ujfB","author":"Artur Martsinkovskyi 译者 Sambodhi","translator":"","tags":["some"],"priority":1},"html":"

随着时间的推移，这一行业正在越来越深地陷入了以开发人员为中心的工程流程，不知不觉花掉了很多时间；而开发人员一人则承担了越来越多的责任。

\n

我认为拓宽知识面，运用对你所负责的部分的理解来更好地完成你所负责的部分，还是有好处的，但要让开发人员成为这样的一个人：对各种领域样样都懂但无一精通，如此一来，会直接影响代码质量、解决方案的选择以及所开发项目的未来。

\n

要知道我们的大脑空间是有限的，但我们可以对一个或几个领域的更深、更好的知识来填充它，或者开始汲取多个领域的信息，结果得到的就是对所有事物都是肤浅的了解。这种知识体系创造了信心泡沫，不幸的是，这种信心并不能证明自己的正确性，结果导致了更槽糕的解决方案，如重新发明轮子、错误的技术选型、用显微镜敲钉子。

"}},{"node":{"frontmatter":{"title":"流式字体的现状","publish":true,"cover":"https://betterwebtype.com/assets/img/posts/state-of-fluid-web-typography/css-locks.mov.gif","showCover":true,"date":"2019-05-14","category":"frontend","url":"https://betterwebtype.com/articles/2019/05/14/the-state-of-fluid-web-typography/","author":"Matej Latin 摘译 Ka","translator":"","tags":["font"],"priority":2},"html":"

流式字体(FULLY FLUID TYPOGRAPHY)此处指的是使用viewpoint unit定义的字体。

\n

流式字体例子:

\n
html {\n  font-size: 1.3vw;\n}\n\nh1 {\n  font-size: 3vw;\n}
\n

css锁响应流式字体例子:

\n
body {\n  font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width])));\n}
\n

作者认为并不适合现在使用：

\n\n

目前作者认为还是应该使用rem的响应式字体：

\n
html {\n  font-size: 100%;\n\n  @media (min-width: 768px) {\n    font-size: 112.5%;\n  }\n}\n\nh1 {\n  font-size: 3rem;\n\n  @media (min-width: 768px) {\n    font-size: 3.5rem;\n  }\n}
"}}]}}