尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

三星Madeira系统探秘:基于Linux内核与HTML5的移动开发实践

三星Madeira系统探秘:基于Linux内核与HTML5的移动开发实践 第一次听到“Madeira”这个词大多数人会先想到北大西洋上的马德拉群岛或者那款经过高温陈年、带浓郁氧化风味的葡萄牙加强酒。但如果你混过2013年前后的极客圈Madeira还有一个完全不同的身份一个由三星主导、基于Linux内核的开源移动操作系统。它想做的事情很直接——不依赖Android完全用HTML5和Web技术搭建一套新的手机系统让普通Web开发者用网页技术就能写原生级应用。这篇文章想聊聊我从听说它、下载模拟器、写第一个应用到在真机上跑通全流程的经历以及这个项目留下的技术遗产。内容主要面向移动开发、嵌入式Linux、开源生态感兴趣的朋友也欢迎想理解“Web技术能不能驱动操作系统”这个问题的读者。1. 项目概述Madeira到底是什么1.1 诞生背景2013年的移动操作系统混战2013年前后的智能手机市场Android和iOS已经形成事实上的双寡头但很多大厂心里都憋着一股劲不想永远做Android的“打工仔”。三星当时手握Galaxy系列的巨大份额却始终受制于谷歌对Android生态的掌控于是内部孵化了多个自研系统项目。大家比较熟知的是Bada和Tizen还有一个相对低调、实验色彩浓厚的就是Madeira。我最早看到Madeira的消息是某个技术论坛转发的三星官方新闻稿大意是“我们正在开发一个新的开源移动平台完全基于Linux内核应用层以HTML5为核心”。说实话当时不少人的第一反应是“用网页写操作系统那不是死路一条吗”。但真正翻完公开技术文档以后我才发现这个项目不是拍脑袋随便试水的它背后有一套相当完整的逻辑。在当时HTML5正处于声量最高的上升期。Flash宣布退出移动端PhoneGap、Cordova这类混合开发方案开始流行整个行业都在赌“Web标准会不会吃掉一切”。三星选择在这个时间点做Madeira本质上是把赌注押在了Web生态的开放性上与其跟Android拼Java原生开发者的数量不如直接把全世界的Web开发者都拉进来。这个思路放到今天看其实和后来各种“小程序容器”“跨平台运行时”有千丝万缕的联系。1.2 系统定位不替代Android做“另一个选择”很多文章把Madeira描述成“Android杀手”这个说法不准确。从项目早期文档来看三星对Madeira的定位更偏向“覆盖面更广的战略储备”它不需要在高端旗舰机上和iOS硬碰硬而是想证明三星有能力在Linux内核之上独立搭起一套包含UI、运行时、应用商店、开发工具链的完整移动平台。Madeira这个名字本身也挺有意思。马德拉酒最大的工艺特点是“加热陈化”被逼着在高温环境里快速熟成。这个项目当时的处境就很像这种酒上游被Android挤压下游要面对Firefox OS这类同样主打HTML5的对手团队只能在有限资源里尽量把技术路线走深。在我看来三星给项目起这个名字某种程度上也暗示了团队的自我定位——我不一定是最先跑出来的但我愿意在高压环境下慢慢沉淀自己的技术栈。1.3 同期项目横向对比都是Linux路线各有不同为了理解Madeira的设计取舍我把它和同期几个同样基于Linux内核的开源移动系统放在一起对比过项目主导方内核应用范式目标设备最终结局Firefox OSMozillaLinux纯HTML5WebAPI直通硬件低端机、功能机2016年停止研发Ubuntu TouchCanonicalLinuxQML原生为主兼容Web容器中高端手机社区继续维护Tizen三星、IntelLinux原生C/QML为主可跑Web应用电视、穿戴、手机转向IoT和电视平台Madeira三星LinuxHTML5为主提供系统特权API中低端手机项目后逐渐淡出这么一排就能看明白Firefox OS和Madeira最像都在押注HTML5但Firefox OS更强调消灭中间层让所有应用直接面对WebAPIMadeira则更务实一些保留了传统Linux系统服务层应用通过系统桥接接口去访问硬件资源。这种思路带来的结果就是Madeira上的Web应用和普通网站长得一模一样但能力边界要宽得多——可以读电量、发短信、打电话只是需要声明权限。2. 核心技术架构拆解2.1 从底层到上层的四层结构我当时是从一个老外的博客里找到Madeira架构文档的看完以后最大的感觉是它没有发明一套全新的系统范式而是把成熟的Linux系统按“Web优先”的思路重新组装了一遍。整体可以分成四层Linux内核层负责驱动程序、进程调度、内存管理、网络协议栈。和主流嵌入式Linux没有本质区别三星把自家设备的传感器、电源管理、Wi-Fi相关驱动都放进了内核树里。硬件抽象层这层的作用是把硬件差异挡在系统服务外面。上层不用关心你是用了哪家触摸屏控制器或者哪个型号的加速度计硬件抽象层统一接口就够了。思路和Android的HAL非常像。系统服务层负责窗口管理、应用包管理、电话服务、多媒体服务、数据存储等。可以把它理解成一座大楼里的水电网管道系统用户平时看不见但每个应用都依赖它。Web运行时层这是整座系统最核心的部分。所有可见界面包括桌面、锁屏、设置页本质上都是通过Web引擎渲染出来的。应用调用系统能力时通过JavaScript桥接接口向系统服务层发请求系统服务处理完以后再回调给页面。这种设计的最大好处是统一开发者不用学Java也不用学C会HTML/CSS/JavaScript就能上手。但代价也很明显——整套系统的流畅度取决于Web渲染引擎的优化水平而2013年左右的移动端Web性能大家心里都有数。2.2 为什么选择“所有界面都是网页”我用一个生活化的类比来理解这个决策普通手机系统像一栋精装修好的公寓你要住进去就得按物业规定改水电Madeira则像一栋全是可拆卸隔断的Loft你只要会用螺丝刀Web技术就能把每一面墙拆了重搭。这个设计在工程上有几个很现实的好处研发速度极快系统UI是一个大网页调整布局、改配色、加交互动效刷新一下就能看到效果不需要重新编译整个系统镜像。开发门槛低不管是三星内部团队还是第三方开发者只要写过网页就能给系统做定制皮肤、写小工具。这和当时需要高成本培训Java/Objective-C开发者的路线完全不同。应用间隔离简单网页应用天然跑在渲染引擎的沙箱里权限控制通过API授权来做出问题的范围被限制在一个页面内不至于把整个系统拖垮。但同样的特点也是它后来被批评的理由如果所有渲染都要经过Web引擎的布局计算和JavaScript执行系统级页面的滚动、切换动画很容易出现掉帧。打个不太严谨的比喻网页技术就像一个什么菜都能做的厨师出餐速度在普通家常菜上没问题可一旦要求是米其林三星的摆盘和火候就会觉得力不从心。2.3 应用模型与特权API普通网页和系统应用之间有什么差距在Madeira里一个最普通的应用就是一个W3C Widget规范的压缩包。包里面有一个配置文件用于声明应用的基本信息、图标、启动页面然后是一堆静态资源文件。应用运行起来后就是一个带webkit内核的浏览器子进程在渲染页面。为了能访问系统能力SDK暴露了一套JavaScript接口。我印象比较深的是获取设备电量这种操作在网页里只需要几行代码function getBatteryLevel() { if (!window.madeira || !window.madeira.systeminfo) { alert(当前环境不支持系统信息接口); return; } window.madeira.systeminfo.getProperty(BATTERY, function (battery) { var output document.getElementById(output); output.innerText 当前电量 battery.level %; }, function (error) { console.error(获取电量失败, error); }); }这段代码的核心思路是异步回调页面先调用接口系统服务层收到指令后去读硬件状态拿到结果再通知页面更新。这种模式现在看很常见但在当时Web开发者的经验里大部分人对“网页能直接读硬件”这件事还是感到非常新鲜的。当然权限不是白给的。如果应用想用拨号、短信、联系人这类敏感能力就必须在配置里显式声明。当时我踩过一个坑写了一个想偷偷发短信的测试应用结果调到短信接口的时候直接被系统拦了返回一个安全错误。后来查文档才知道每个特权API都需要在配置文件的feature节点里声明系统才能把这个能力放给应用。3. 开发环境搭建与第一个应用3.1 开发前的准备一台Linux虚拟机就够了Madeira官方SDK当时只发布了Linux版我在Windows机器上折腾了半天最终老老实实开了一个Ubuntu 14.04虚拟机。安装依赖挺顺利的主要需要以下基础包sudo apt-get update sudo apt-get install -y build-essential python3 zip unzip qemu-kvm libgl1-mesa-dev和Android SDK动辄几个GB的安装包相比Madeira的SDK体积算很克制的解压以后不到800MB。解压后目录结构大概是这样的madeira-sdk/ ├── bin/ # 工具链入口 ├── emulator/ # 模拟器相关 ├── platform-tools/ # 调试桥工具 ├── tools/ # 打包、签名工具 ├── docs/ # API文档和开发指南 └── examples/ # 官方示例应用我当时看到examples目录里有一个“memo”便签应用和一个“music”音乐播放器都是简洁的HTML5应用代码量不大是很好的学习起点。强烈建议新手先跑一遍官方示例再动手写自己的东西直接开局很难搞清楚系统约定的目录结构。3.2 启动模拟器第一次把系统跑起来SDK提供的模拟器是一个基于QEMU改造的虚拟机启动方式和Android模拟器差不多。启动命令大致如下cd madeira-sdk ./bin/emulator --image default --size 720x1280 --memory 1024我用的是默认镜像屏幕分辨率选的720x1280内存给1GB。启动过程比我想象的顺利终端里刷了一堆内核日志以后一个完整的系统界面就在模拟器窗口里出现了。第一次看到那个桌面感觉和Android还挺像的顶部有状态栏中间是可滑动的应用图标网格底部有三个虚拟按键。不过有一点明显区别整个桌面滚动非常跟手但设置页、应用列表这些界面切换的时候偶尔能感觉到页面加载的空白期。这就是前面说的Web渲染引擎的代价——界面在切换时需要重新布局和绘制性能自然会打折扣。模拟器启动后可以用自带的调试桥工具连接cd madeira-sdk/platform-tools ./sdb connect 127.0.0.1:26101 ./sdb devices输出列表里能看到模拟器设备和adb devices的输出形式几乎一样。sdb这个工具是全流程的关键安装应用、查看日志、推送文件、截屏全部靠它完成。3.3 编写第一个应用一个极简的Hello World我从官方便签应用里抽出了一个最小模板自己写了一个“Hello Madeira”页面。工程目录结构非常简单hello-madeira/ ├── config.xml ├── index.html ├── css/ │ └── style.css └── js/ └── main.jsconfig.xml是W3C Widget配置文件主要声明应用的元信息?xml version1.0 encodingUTF-8? widget xmlnshttp://www.w3.org/ns/widgets idcom.example.hello version1.0 nameHello Madeira/name content srcindex.html/ icon srcicon.png/ feature namehttp://madeira.example.org/features/systeminfo/ /widget这里有个细节值得注意feature节点不是随便写的。如果应用只是展示静态页面什么都不需要声明但如果你想调用系统信息、电池、存储这些接口必须在配置里把这个能力申请出来。和Android的Manifest权限机制一个逻辑只是Madeira把声明放在Web标准的框架里。index.html就是一个普普通通的网页!DOCTYPE html html langzh-CN head meta charsetUTF-8 meta nameviewport contentwidthdevice-width, initial-scale1.0 link relstylesheet hrefcss/style.css titleHello Madeira/title /head body div classapp h1Hello Madeira/h1 p这是一个在Madeira系统上运行的HTML5应用/p button idbtnInfo获取设备信息/button p idoutput/p /div script srcjs/main.js/script /body /html主逻辑同样很直白调用系统信息接口把设备名称、系统版本、屏幕分辨率取出来显示在页面上。这个简单的功能在Android原生开发里可能需要写一堆布局代码但在Madeira里就是几行JavaScript。3.4 打包、安装与运行Web应用的“安装包”长什么样在Madeira里应用的安装包是一个扩展名为.wgt的压缩包。我当时手动打包的命令是cd hello-madeira zip -r ../hello-madeira.wgt config.xml index.html css/ js/注意打包zip时要保持相对路径正确不要把外面的目录一起塞进去。我一开始在工程根目录的上一级直接打包结果配置文件被埋在了子目录里导致系统提示“找不到应用入口”。安装到模拟器的流程也很简洁cd madeira-sdk/platform-tools ./sdb connect 127.0.0.1:26101 ./sdb install ../hello-madeira.wgt ./sdb launch com.example.hello启动以后模拟器桌面上多了一个“Hello Madeira”图标点击进去就是那个页面。第一次看到自己的网页变成一个手机应用图标时心里还是挺激动的。整个开发链路和Web开发几乎零距离唯一的区别是安装包需要遵循W3C Widget规范。4. 真机刷机与系统实操记录4.1 设备与固件选择模拟器跑通以后我开始琢磨真机体验。当时官方放出了适配Galaxy S3型号i9300的实验性固件包我觉得这个方案最靠谱因为网上大部分人的实测贴用的都是这个型号。这里有一点必须提醒刷机有风险请务必备份好数据确认你的机器是i9300而不是其他衍生型号否则轻则无法开机重则可能影响基带分区。固件包是一个tar.md5格式的文件这种格式对熟悉三星刷机流程的朋友来说应该不陌生。我先把手机充满电然后把电脑上的三星USB驱动装好准备工作大概花了半小时。4.2 刷机全过程Odin的实用要点刷机工具用的是Odin这个工具在三星粉丝圈里知名度极高。步骤说起来很简单但有几个细节新手容易出错关机状态下同时按住音量下键Home键电源键保持约5秒手机进入Download模式。屏幕上出现警告界面后按一下音量上键确认进入下载模式。打开电脑上的Odin会看到ID:COM栏变成蓝色表示连接成功。点击“AP”按钮老版本叫“PDA”选择下载好的Madeira固件包。确认“Auto Reboot”和“F. Reset Time”两个选项是勾选状态。点击“Start”等待进度条走完。整个写入过程大约持续两分多钟。刚开始刷的时候我心里很忐忑因为进度条在中间某一格停了近半分钟没动。后来才知道这是由于固件包需要向系统分区写入大量文件停顿其实是在正常拷贝数据。只要USB线稳定、接口没松动不需要去动它耐心等就好。4.3 首次开机的真实体验刷完以后手机会自动重启第一次启动比普通Android开机慢不少我盯着“Madeira”的Logo看了大概三分钟才进入系统初始化向导。说实话第一次在物理设备上看到这套系统体验和模拟器还是有差别的。真机上的滑动流畅度比模拟器好很多毕竟硬件直接协同不再是模拟指令集。但打开设置页、切换应用的时候依然能感觉到Web渲染的延迟。最有意思的是深挖界面——下拉通知栏、设置菜单、锁屏界面按Android时代的审美来看完完全全是自定义实现的。系统信息里可以看到Linux内核版本号还有Madeira自己的Build号。真机连上sdb调试以后还能做很多有意思的事情。我直接通过命令行给真机推送了一个测试文件又调用摄像头接口拍了张照片照片被保存到系统相册目录。整个过程不需要打开任何原生调试界面就是一套很纯粹的Web远程调试体验。5. 常见问题与排查技巧实录5.1 我在折腾中遇到过的几个典型问题折腾这套系统最大的障碍不是功能复杂而是资料太分散、好多坑只能自己踩。下面这个速查表是我根据实测整理出来的希望能帮你少走弯路问题现象可能原因解决办法模拟器启动后一直黑屏宿主机KVM虚拟化未启用检查BIOS里的VT-x选项在启动参数中加上-no-accel用纯软件模拟模式安装.wgt提示“找不到应用入口”打包时目录结构不正确解压后确认config.xml位于压缩包根目录不要在config.xml外面再套一层目录应用启动后白屏入口页面文件路径错误或引用了未声明的特权API核对config.xml里content src路径再看一下feature声明是否覆盖了所有用到的APIsdb连接不上模拟器调试桥服务未启动或端口不对先执行sdb kill-server再执行sdb start-server重新连接目标端口真机Wi-Fi打不开固件与硬件HAL层兼容性不佳换固件版本或检查内核日志找到具体驱动加载失败的原因按钮点击没有反应JavaScript代码报错页面运行在异常状态用sdb dlog命令查看系统日志定位JS异常堆栈我的体会是这个系统的问题定位思路和普通Web开发很相似先看控制台报错再看网络请求最后检查API调用是否被安全策略拦截。整体调试体验对Web开发者非常友好不需要像原生开发那样去分析Native崩溃堆栈。5.2 性能调优的几条实用经验虽然Madeira的Web渲染性能不强但踩过几次坑以后我发现一些能让应用跑得更流畅的办法减少页面内重排尽量不在滚动过程中频繁修改DOM结构把样式变化放到渲染层合成能明显减少掉帧。避免同步请求所有系统API都是异步回调如果你的代码用同步轮询代替回调界面就会卡成PPT。图片大小控制系统对位图的解码能力有限过大图片会拖慢页面切换能压缩就压缩。合理使用CSS动画简单位移和透明度动画效果不错但复杂的3D变换容易触发新的渲染层反而增加开销。这些优化经验放在今天做小程序或者WebView混合应用时依然适用。历史项目虽然没跑出来但它留下的这套优化实践其实一直在被后来的技术继承。5.3 参考资料从哪里找现在想找Madeira的原始资料最稳定的入口是Internet Archive里的SDK包备份以及一些老博客的实测贴。我在折腾过程中主要靠以下三类资料官方文档快照SDK压缩包里自带docs目录里面有API参考和开发指南是最可靠的一手资料。示例应用源码多多研究SDK自带的examples目录比看任何教程都直观。论坛帖子2014年前后的XDA、国内数码论坛上有不少折腾帖很多问题解法都是靠这些帖子摸索出来的。我的建议是先花一个晚上把examples目录里的所有示例应用都跑一遍再挑一个功能简单的模仿改写。这套系统的学习曲线其实不长只要你Web基础扎实大概两三天就能上手。6. 关于Madeira没落的复盘思考6.1 为什么跑得快却活不久大概在2014年下半年以后Madeira的消息就开始变少最后基本停止更新了。我后来复盘过原因感觉最核心的还是生态问题而不是技术路线问题。移动操作系统是一场三方博弈开发者愿意为平台写应用用户才愿意买设备有了用户开发者才愿意进场。Madeira在技术上完成了“从0到1”的验证但三星当时同时要维护Bada、Tizen和自家的Android产品线能给Madeira长期输血的项目资源非常有限。另外HTML5应用虽然开发门槛低但2013年左右的移动Web引擎性能不足以支撑复杂应用。拿系统自带的应用商店来说里面上架的多数应用都是工具类的小应用很少有重交互、重数据的场景。一套系统如果没有杀手级应用就很难吸引普通用户换机尝试。6.2 这个项目给后来者留下了什么从“技术遗产”的角度看Madeira并非毫无价值。它是最早把“Web技术作为系统核心交互层”这件事真正落地到手机上的项目之一。后来的很多跨平台思路比如PWA的离线能力、小程序容器、游戏引擎里的WebView渲染方案都和Madeira当年的尝试有相通之处。它用四层架构把Linux内核、系统服务、Web运行时、应用层解耦这套分层思想今天在Android上做重WebView应用时也依然能借鉴。换句话说单独看Madeira本身它是一次不成功的产品尝试但如果把它放进整个行业的技术演进脉络里它是移动端Web运行时实验的一个重要案例。我翻过的很多技术文档里面的接口设计思路其实比某些跟风做的“跨平台框架”要扎实得多。6.3 回头再看我会怎么选如果现在有人问我当年值不值得花时间折腾Madeira我的答案依然是值得。刷机的时候害怕砖调API的时候被文档坑过但这些折腾让我完整理解了一个操作系统从上到下的运行链路。那时候为了追一个“应用无法启动”的bug我学会了看内核日志搞懂了应用安装的权限校验流程也第一次意识到一个网页从入口文件到真实调用硬件资源中间要经历多少关卡。我个人最大的体会是判断一个技术项目值不值得学不应该只看它最后是否商业成功。Madeira让我在很短时间里把“Web前端”和“操作系统底层”这两块知识串联了起来这种视角在后来做Android开发、做嵌入式项目时都起到了很重要的作用。如果你也对移动系统、嵌入式Linux感兴趣推荐找一台老设备按照我上面写的流程亲自刷一遍。记得准备一根稳定可靠的USB线别在刷机进度条走了一半的时候突然断连——这个教训我是交过学费的。
返回列表