一个 Angular 开发人员对腾讯 Cloud Studio 使用后的体验报告

笔者是一位 Angular 开发工程师,之前尝试过国外一款著名的在线编辑器,StackBlitz. 这款编辑器功能强大,但因为服务器在国外,所以我平时访问的时候,由于网络的原因,在编辑代码和本地运行编译好的 Angular 应用时,经常感觉到延迟,影响了用户体验。

下图是 StackBlitz 在线编辑器的 home 界面:

这次听说腾讯推出了自己的 Cloud Studio 之后,非常激动,第一时间就在浏览器里进行试用了。

使用 Cloud Studio 创建第一个 Angular 应用

访问 Cloud Studio 的官网, 发现支持直接使用微信和 Github 登录,这样连账号注册的过程都省去了,很方便。

我使用微信成功登录后,新建一个工作空间(Workspace):


工作控件列表里,除了我最关心的 Angular 工程模板之外,还有 React,Vue,Hexo 等许多其他的项目工程模板。

选择 Angular 项目模板之后,Cloud Studio 自动生成一个 Angular 应用的 Template,我们观察一下其中的 package.json,里面包含了 Angular 应用的所有依赖:

其中 Angular 版本为 ~12.1.0,这个版本也算比较新了。

Cloud Studio 里和 Angular 应用编译和运行相关的命令行

我们可以看到,Cloud Studio 自动在 Terminal 窗口里运行了如下的命令行:

set port=4200 && export PORT=4200 && yarn && yarn start --port=4200

仅仅花费了 6 秒多的时间,就完成了应用的编译。但下图的 Console 输出,有两点美中不足:

(1) Build At 时间戳的时区显示的是服务器端的时区,个人认为按照用户在浏览器里的时区设置对用户更友好一些,比如下图我期望时间戳显示的是我本地时间 18:02:51,而不是服务器端的 10:02:51.

(2) 打印的日志 Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200,这里会误导用户,因为实际上我们根本无法在浏览器里通过直接访问 http://localhost:4200/ 的方式,来打开我们在 Cloud Studio 里运行的 Angular 应用。

正确的 url 应该是这个自动生成的 url:https://dzdkkc-wbsddy-4200.preview.myide.io/

这里我在 Terminal 里进行了更多的测试,比如直接执行命令行 ng serve

发现整个应用虽然仍然能够成功编译,但是浏览器访问 url https://dzdkkc-wbsddy-4200.preview.myide.io 时,遇到错误消息:Invalid Host header,于是不知道怎么继续下去了,只得继续使用冗长的命令行 set port=4200 && export PORT=4200 && yarn && yarn start --port=4200 来启动应用。

整个 Cloud Studio 可以看成一个运行在浏览器环境中的 Visual Studio Code,因此对于笔者来说,不存在任何的学习曲线。

笔者短短的 Cloud Studio 使用体验非常流畅,个人认为这是一款完全不输于 StackBlitz 的在线编辑器。笔者打算将来的一些小型验证项目,将不再使用 StackBlitz,而是切换到访问速度更快更流畅的腾讯 Cloud Studio 上来。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,847评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,208评论 1 292
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,587评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,942评论 0 205
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,332评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,587评论 1 218
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,853评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,568评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,273评论 1 242
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,542评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,033评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,373评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,031评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,073评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,830评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,628评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,537评论 2 269

推荐阅读更多精彩内容