微信小程序的简单介绍

本文对比了微信小程序与HTML在开发语言、组件封装、执行速度、文件引入、尺寸单位等方面的差异,介绍了小程序的WXML、WXSS语言特点,以及其在组件、执行效率上的优势。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

微信小程序的简单介绍

1.与HTML的区别

HTML微信小程序
<div></div><view></view>
<h1></h1> ---<h6></h6><span></span><p></p><view></view>
<i class="icon"<icon></icon>
<iput type="text"><input/>
<iput type="checkbox"><checkbox/>
<iput type="radio"><radio/>
<iput type="file"><view bindtab="chooseImage">
<a href="#"></a><navigator url="#" redirect></navigator >
<img src=""><image src="" ></image >

2.小程序与HTML的差别

  1. 开发语言的不同。
    小程序自己开发了一套WXML标记语言和WXSS样式语言,并非直接使用标准的HTML5+CSS3。小程序自己开发了一套WXML标记语言和WXSS样式语言,并非直接使用标准的HTML5+CSS3。
  2. 组件封装不同。
    小程序独立出来了很多原生APP的组件,在HTML5需要模拟才能实现的功能,小程序里可以直接调用组件。小程序独立出来了很多原生APP的组件,在HTML5需要模拟才能实现的功能,小程序里可以直接调用组件。
  3. 执行速度
    传统HTML5在加载的时候受限于网络环境,需要顺序加载HTML、CSS、JS,然后返回数据,最后渲染页面显示在浏览器中。用户经常需要等待很长时间,体验会受到影响。
    相比之下,小程序的两个线程:Appservice Thread和View Thread会同时进行、并行加载,甚至Appservice Thread会更早执行,当视图线程加载完,通知Appservice,Appservice 会把准备好的数据用setData的方法返回给视图线程。
    小程序的这种优化策略,可以减少用户的等待时间、加快小程序的响应速度
  4. 文件引入
    WXML提供两种文件引入方式,import和include。区别在于:import可以引入定义好的template模板,模板是有作用域的;而include就是拷贝一个公用的代码片段到目标文件中,适合做公共页面片的拆分。
  5. 尺寸单位
    WXSS支持的单位有px、rem和rpx,其中rem和rpx可以针对屏幕容器进行适配,px则为固定尺寸。
    在iPhone6上,1rpx=0.5px。建议:开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。
    在WXSS和WXML中定义的rpx单位最终会转换为在手机端可以识别的rem单位。
    所以工程师拿到750的设计稿,在PS中量取的容器大小,可以直接定义为rpx,不需要进行2倍尺寸的换算。
  view {
    font-size: 66rpx;
    width: 666rpx;
    height: 666rpx;
}

小程序使用的开发工具:小程序开发者工具
微信小程序的开发工具,基于MINA框架(现已取消该名称),现在官方公布的工具名为微信web开发者工具。小程序开发工具是一种基于Native System系统层的框架,由于并非运行在浏览器中,所以JavaScript在web中的一些诸如Document、Window等方法无法使用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值