微信小程序开发总结

不支持HTML、没有 Dom。网页用的 JS、CSS 基本要全部重写,WXML 的语法和 HTML 差异还挺大,基本是一个个照着手册的属性去改。CSS 选择器不支持级联。 小程序源码打包后的大小限制为1M,超大传不上去。单次通过 wx.request传输的数据最大也是1M。 MINA 框架实现的 tab bar,最多5个 tab;通过 wx. navigateTo 推入后台的页面最多5层,超过会无法打开新页面。 小程序没有 webview 控件,自带的 view 和 text 又不支持图文混排,还不能动态 set WXML …… 所以小程序上的富文本也就只能做到固定焦点图+纯文本+emoji了 [二哈] 不支持 A 标签,无法打开普通网页。 未经腾讯公司授权的情况下,微信小程序的添加,必须是免费的,不得设置付费添加。 强制用户分享或关注:分享或关注后才能继续下一步操作。包括但不限于:分享或关注后方可解锁功能或能力,分享或关注后方查阅、下载图片或视频等。 不得滥用模板消息和客服消息,包括但不限于利用模板消息和客服消息骚扰用户、广告营销、向用户发送与客服咨询无关的任何文案、图片。 完成注册后,如帐号长期未登录,微信小程序可能被终止使用,终止使用后注册所使用的邮箱、身份证、微信号等信息可能将被取消注册状态。 除个体工商户类型可认证5个小程序外,其他类型一个主体可认证50个小程序 标签数量不得少于2个,最多不得超过5个,为确保点击区域,建议标签数量不超过4项 绑定开发者 > 登录微信公众平台小程序,进入用户身份- 开发者,新增绑定开发者。 > 个人主体小程序最多可绑定5个开发者,10个体验者。 > 未认证的组织类型小程序最多可绑定10个开发者,20个体验者 > 已认证的小程序最多可绑定20个开发者,40个体验者 > 代码大小限制2M以内(包括图片等所有资源) > 请问现在小程序代码支持多大? > 采用分包,可以到 4 M > wx.setStorage(OBJECT) 小程序存储的容量有多大限制?目前每个小程序限制5M 绑定开发者 ` 个人主体小程序最多可绑定5个开发者,10个体验者。 未认证的组织类型小程序最多可绑定10个开发者,20个体验者 已认证的小程序最多可绑定20个开发者,40个体验者。 ` 请求必须是https ...

2018年5月30日 · 1 分钟 · 天边的星星

使用 Doxygen 生成源码文档

Doxygen 是一个开源跨平台的,以类似 JavaDoc 风格编写软件参考文檔的工具 Getting started 创建配置文件 `doxygen -g <config-<span class="hljs-built_in">file</span>>` 运行 doxygen `doxygen <config-<span class="hljs-built_in">file</span>>` Configuration 项目名称 `<span class="hljs-attr">PROJECT_NAME</span> = My Project` 项目简介 `<span class="hljs-attr">PROJECT_BRIEF</span> = What a project` 项目 Logo `<span class="hljs-attr">PROJECT_LOGO</span> = src/images/logo.png` 主页面 `<span class="hljs-attr">USE_MDFILE_AS_MAINPAGE</span> = README.md` 文档的语言 `<span class="hljs-attr">OUTPUT_LANGUAGE</span> = Chinese` 指定需要生成文档的文件,以空格分割 `<span class="hljs-attr">INPUT</span> = ./src` 排除的文件 `<span class="hljs-keyword">EXCLUDE</span> = .<span class="hljs-regexp">/src/</span>Demo` 写入文档的路径 `<span class="hljs-attr">OUTPUT_DIRECTORY</span> = ./docs` 是否搜索子目录 `<span class="hljs-attr">RECURSIVE</span> = <span class="hljs-literal">YES</span>` 标记指定一个或多个通配符模式 ...

2018年5月29日 · 1 分钟 · 天边的星星

Android 优化工具收集

在开发Android的过程中,我们会遇到各种问题,有时候为了满足某一个需求(或者快速的上线完成一个版本), 我们会使用各种框架,代码编写可能随意一些,造成一些冗余的代码,整个工程越跑越慢,APP越跑越慢, 当达到一定阶段的时候,就不得不需要我们进行工程的优化,今天就来说说优化过程中使用到的工具。 Android的应用性能的指标主要有: 布局复杂度:布局复杂会导致布局需要更长的时间,从而导致进入应用慢、页面切换慢; 耗电量:耗电量大会导致机器发热、缩短机器的有效使用时长; 内存:内存消耗大会导致频繁GC,GC时会暂停其它工作,导致页面卡顿;内存泄露会导致剩余可用内存越来越小;内存不足会导致应用异常; 网络:频繁的网络访问会导致耗电和影响应用的性能;网络交互数据大小会影响网络传输的效率; 程序执行效率:糟糕的代码会严重影响程序的运行效率,UI线程过多的任务会阻塞应用的正常运行,长时间持有某个对象会导致潜在的内存泄露,频繁的IO操作、网络操作而不用缓存会严重影响程序的运行效率。 工具 Memory Monitor:查看整个app所占用的内存,以及发生GC的时刻 Allocation Tracker:使用此工具来追踪内存的分配。 Heap Tool:查看当前内存快照,便于对比分析哪些对象有可能是泄漏了的。 Battery History Tool 电量审查工具(Android 5.0,不属于编译器的工具) traceview 工具(计算每个方法占用CPU时间) Networking Traffic Tool (android studio)网络请求发生的时间,每次请求的数据量等信息 Hierarchy viewer 层级显示工具(检测布局复杂度,各视图的布局耗时情况) Lint 代码审查工具 给出代码优化建议 耗电量:Android开发者模式中的电量统计 leakcanary:square/leakcanary · GitHub,通过集成到程序中的方式,在程序运行时检测应用中存在的内存泄露,并在页面中显示,在应用中集成leancanry后,程序运行时会存在卡顿的情况,这个是正常的,因为leancanry就是通过gc操作来检测内存泄露的,gc会知道应用卡顿,说明文档:LeakCanary 中文使用说明、LeakCanary: 让内存泄露无所遁形。 GT:GT Home,GT是腾讯开发的一款APP的随身调测平台,利用GT,可以对CPU、内存、流量、点亮、帧率/流畅度进行测试,还可以查看开发日志、crash日志、抓取网络数据包、APP内部参数调试、真机代码耗时统计等等,需要说明的是,应用需要集成GT的sdk后,GT这个apk才能在应用运行时对各个性能进行检测。 iTest:iTest,业内首创的Android自动化性能监控工具,它能够记录特定应用的性能消耗情况,包括cpu、内存、流量、电量等信息,支持浮窗实时查看应用的具体信息,iTest不需要集成sdk到应用中,在itest中选中需要测试的应用即可进行测试; Emmagee:Emmagee下载、NetEase/Emmagee · GitHub,网易开发的性能检测工具,Emmage和iTest一样,不需要在应用中集成sdk,能够对应用的常用性能指标进行检测,并以csv的格式保存方便查看应用的各项参数 APT:Tencent/apt | CODE,腾讯出的。 FPSService:百度一位开发者写的帧率测试工具,需要集成到应用中才可查看 AndroidGodEye:AndroidGodEye是一个可以在PC浏览器中实时监控Android数据指标(比如性能指标,但是不局限于性能)的工具,你可以通过wifi/usb连接手机和pc,通过pc浏览器实时监控手机性能。 系统分为三部分: Core 核心部分,提供所有模块; Debug Monitor部分,提供Debug阶段开发者面板; Toolbox 快速接入工具集,给开发者提供各种便捷接入的工具。 AndroidGodEye提供了多种监控模块,比如cpu、内存、卡顿、内存泄漏等等,并且提供了Debug阶段的Monitor看板实时展示这 些数据。而且提供了api供开发者在release阶段进行数据上报。 慢慢一个个工具使用吧 参考引用 https://blog.csdn.net/u010255127/article/details/49135551 https://segmentfault.com/a/1190000012413613

2018年5月23日 · 1 分钟 · 天边的星星

RxJava 从入门到放弃再到不离不弃

作者寄语 很久之前就想写一个专题,专写Android开发框架,专题的名字叫 XXX 从入门到放弃 ,沉淀了这么久,看过网络诸多大神的博客,静下心来开始写这个专题,为什么叫入门到放弃呢;相信大家学习新框架的时候,尤其是像Rxjava或者Dagger等等这种新的编程思想;需要一定的阅读理解能力和思维逻辑;那么本专题旨在帮助大家不要太过急功近利,不要被冗长的代码和文章,晦涩的思想所打败,相信大家只要坚持看完,一定会有所收获的;废话不多说,那么这个专题开篇就以RxJava来讲吧,预计后面还会有几篇大型框架的讲解,想想还有点小激动; 友情提示:文章较长,请耐心看完; 前言 RxJava等编程思想正在Android开发者中变的越来越流行。唯一的问题就是上手不容易,尤其是大部分人之前都是使用命令式编程语言。 首先要先理清这么一个问题:Rxjava和我们平时写的程序有什么不同。相信稍微对Rxjava有点认知的朋友都会深深感受到用这种方式写的程序和我们一般写的程序有很明显的不同。我们一般写的程序 统称为命令式程序,是以流程为核心的,每一行代码实际上都是机器实际上要执行的指令。而Rxjava这样的编程风格,称为函数响应式编程。函数响应式编程是以数据流为核心,处理数据的输入,处理以及输出的。这种思路写出来的代码就会跟机器实际执行的指令大相径庭。所以对于已经习惯命令式编程的我们来说,刚开始接触Rxjava的时候必然会很不适应,而且也不太符合我们平时的思维习惯。但是久而久之你会发现这个框架的精髓,尤其是你运用到大项目中的时候,简直爱不释手,随着程序逻辑变得越来越复杂,它依然能够保持代码简洁。 RxJava是什么 a library for composing asynchronous and event-based programs using observable sequences for the Java VM 解释:一个对于构成使用的Java虚拟机观察序列异步和基于事件的程序库 RxJava 是一个响应式编程框架,采用观察者设计模式。所以自然少不了 Observable 和 Subscriber 这两个东东了。 RxJava 是一个开源项目,地址:https://github.com/ReactiveX/RxJava RxAndroid,用于 Android 开发,添加了 Android 用的接口。地址: https://github.com/ReactiveX/RxAndroid 基本概念 网上关于RxJava的博文也有很多,我也看过许多,其中不乏有优秀的文章,但绝大部分文章都有一个共同点,就是侧重于讲RxJava中各种强大的操作符,而忽略了最基本的东西——概念,所以一开始我也看的一脸懵逼,看到后面又忘了前面的,脑子里全是问号,这个是什么,那个又是什么,这两个长得怎么那么像。举个不太恰当的例子,概念之于初学者,就像食物之于人,当你饿了,你会想吃面包、牛奶,那你为什么不去吃土呢,因为你知道面包牛奶是用来干嘛的,土是用来干嘛的。同理,前面已经说过,RxJava无非是发送数据与接收数据,那么什么是发射源,什么是接收源,这就是你应该明确的事,也是RxJava的入门条件之一,下面就依我个人理解,对发射源和接收源做个归类,以及RxJava中频繁出现的几个“单词”解释一通; Observable:发射源,英文释义“可观察的”,在观察者模式中称为“被观察者”或“可观察对象”; Observer:接收源,英文释义“观察者”,没错!就是观察者模式中的“观察者”,可接收Observable、Subject发射的数据; Subject:Subject是一个比较特殊的对象,既可充当发射源,也可充当接收源,为避免初学者被混淆,本章将不对Subject做过多的解释和使用,重点放在Observable和Observer上,先把最基本方法的使用学会,后面再学其他的都不是什么问题; Subscriber:“订阅者”,也是接收源,那它跟Observer有什么区别呢?Subscriber实现了Observer接口,比Observer多了一个最重要的方法unsubscribe( ),用来取消订阅,当你不再想接收数据了,可以调用unsubscribe( )方法停止接收,Observer 在 subscribe() 过程中,最终也会被转换成 Subscriber 对象,一般情况下,建议使用Subscriber作为接收源; Subscription :Observable调用subscribe( )方法返回的对象,同样有unsubscribe( )方法,可以用来取消订阅事件; Action0:RxJava中的一个接口,它只有一个无参call()方法,且无返回值,同样还有Action1,Action2…Action9等,Action1封装了含有 1 个参的call()方法,即call(T t),Action2封装了含有 2 个参数的call方法,即call(T1 t1,T2 t2),以此类推; Func0:与Action0非常相似,也有call()方法,但是它是有返回值的,同样也有Func0、Func1…Func9; RxJava最核心的两个东西是Observables(被观察者,事件源)和Subscribers(观察者)。Observables发出一系列事件,Subscribers处理这些事件。这里的事件可以是任何你感兴趣的东西(触摸事件,web接口调用返回的数据…) ...

2018年4月28日 · 15 分钟 · 天边的星星

用 webpack 和 babel 配置 react 开发环境

1. 安装 react 要使用 react,就必须装下面两个包的。 `$ npm &lt;span class="hljs-keyword">install&lt;/span> &lt;span class="hljs-comment">--save react react-dom&lt;/span> ` 2. 建立 babel 可能你不懂 babel 是什么,你可以把它理解为编译器,它能把 react 代码转成一般浏览器可读可执行的代码,通常可以用它来转化 react 或 vue 这样的前端代码,或者把 es6 代码转成普通的 javascript 代码等等。 如果还不理解的话,可以看我这篇文章 babel 入门指南。 要让 babel 很好的转化 react 代码,首先要安装好 babel,再装 babel 转化 react 的包。 运行下面的命令。 `$ npm &lt;span class="hljs-keyword">install&lt;/span> &lt;span class="hljs-comment">--save-dev babel-core babel-preset-react babel-preset-env&lt;/span> ` 创建 .babelrc 文件。 { <span class="hljs-attr">"presets"</span>: [<span class="hljs-string">"env"</span>, <span class="hljs-string">"react"</span>] } 为什么我知道要这么做呢? 因为我是分别结合 babel 和 react 的官网给的最新官方指南。 ...

2018年4月4日 · 2 分钟 · 天边的星星

为TabLayout添加角标的最简单方法

一、前言 在开发中,我们常常需要ViewPager结合Fragment一起使用,来实现多页签的切换效果。在以前,我们有以下一系列第三方库来帮我们实现: PagerSlidingTabStrip SmartTabLayout FlycoTabLayout ViewPagerIndicator … 而现在,我们可以使用Design support library库的TabLayout来实现了。 二、最终效果图 三、TabLayout的使用 1. 添加依赖 由于TabLayout在design包内,所以首先需要在app目录下的build.gradle中添加以下依赖: ``` 1 2 3 4 ``` <td class="code hljs bash"> <div class="top-box hide"> <div class="alert-info"> </div> </div> ``` dependencies { … compile ‘com.android.support:design:23.4.0’ } </td> </tr> </table></figure> ## 2. 创建布局 {#2-创建布局} 布局相当简单,只要添加TabLayout和ViewPager的布局即可: ### layout/activity_main.xml {#layout-activity-main-xml}<figure class="highlight xml"> <table> <tr> <td class="gutter"> <div class="top-box hide"> <div class="alert-info"> </div> </div> ``` <span class="line">1</span> <span class="line">2</span> <span class="line">3</span> <span class="line">4</span> <span class="line">5</span> <span class="line">6</span> <span class="line">7</span> <span class="line">8</span> <span class="line">9</span> <span class="line">10</span> <span class="line">11</span> <span class="line">12</span> <span class="line">13</span> <span class="line">14</span> <span class="line">15</span> <span class="line">16</span> <span class="line">17</span> <span class="line">18</span> <span class="line">19</span> <span class="line">20</span> <span class="line">21</span> </td> <td class="code hljs xml"> <div class="top-box hide"> <div class="alert-info"> </div> </div> ``` <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" ...

2018年4月4日 · 8 分钟 · 天边的星星

常用工具配置

由于系统崩溃,造成平时积累的软件工具及开发常用插件丢失,好记性不如记录下来,方便以后查阅。 Android Studio插件 1. GsonFormat 2. ADB Idea 3. Android Develop Templates 4. Android Dialog 5. Android Drawable Importer 6. Android Drawable Viewer 7. Android Parcelable code generator 8. Android Selectors Generate 9. Android String.xml To CSV Converter 10. dash 11. Database Navigator 12. JSON TO Kotlin Class 13. Markdown Navigator 14. Parcelable Code Generator (for kotlin) 15. Generator Android Resource sublime Text3 数据恢复 复制 /Users/用户/Library/Application\ Support/Sublime\ Text\ 3/Local/Session.sublime_session 这个就是之前没有保存的数据,通过复制/Users/用户/Library/Application\ Support/Sublime\ Text\ 3/下面的所有内容,来恢复插件等等!!

2018年4月2日 · 1 分钟 · 天边的星星

Nginx虚拟目录alias和root目录

nginx是通过alias设置虚拟目录,在nginx的配置中,alias目录和root目录是有区别的: 1)alias指定的目录是准确的,即location匹配访问的path目录下的文件直接是在alias目录下查找的; 2)root指定的目录是location匹配访问的path目录的上一级目录,这个path目录一定要是真实存在root指定目录下的; 3)使用alias标签的目录块中不能使用rewrite的break(具体原因不明);另外,alias指定的目录后面必须要加上”/”符号!! 4)alias虚拟目录配置中,location匹配的path目录如果后面不带”/”,那么访问的url地址中这个path目录后面加不加”/”不影响访问,访问时它会自动加上”/”; 但是如果location匹配的path目录后面加上”/”,那么访问的url地址中这个path目录必须要加上”/”,访问时它不会自动加上”/”。如果不加上”/”,访问就会失败! 5)root目录配置中,location匹配的path目录后面带不带”/”,都不会影响访问。 举例说明(比如nginx配置的域名是www.wangshibo.com): (1) location /huan/ { alias /home/www/huan/; } 在上面alias虚拟目录配置下,访问http://www.wangshibo.com/huan/a.html实际指定的是/home/www/huan/a.html。 注意:alias指定的目录后面必须要加上”/”,即/home/www/huan/不能改成/home/www/huan 上面的配置也可以改成root目录配置,如下,这样nginx就会去/home/www/huan下寻找http://www.wangshibo.com/huan的访问资源,两者配置后的访问效果是一样的! location /huan/ { root /home/www/; } (2) 上面的例子中alias设置的目录名和location匹配访问的path目录名一致,这样可以直接改成root目录配置;那要是不一致呢? 再看一例: location /web/ { alias /home/www/html/; } 访问http://www.wangshibo.com/web的时候就会去/home/www/html/下寻找访问资源。 这样的话,还不能直接改成root目录配置。 如果非要改成root目录配置,就只能在/home/www下将html->web(做软连接,即快捷方式),如下: location /web/ { root /home/www/; } # ln -s /home/www/web /home/www/html //即保持/home/www/web和/home/www/html内容一直 所以,一般情况下,在nginx配置中的良好习惯是: 1)在location /中配置root目录; 2)在location /path中配置alias虚拟目录。 如下一例: server { listen 80; server_name www.wangshibo.com; index index.html index.php index.htm; access_log /usr/local/nginx/logs/image.log; location / { root /var/www/html; } ...

2018年3月27日 · 1 分钟 · 天边的星星

Android 分包(多dex)处理

Android 分包导致低于5.0版本报错ClassNotFoundException 项目在4.4系统运行就报错,在5.0以上没问题。原因就是 报错ClassNotFoundException 方法数超64K(1K=1024,65536刚好是64K);需要分包操作 解决方案 1、在module下的build.gradle文件 ,添加multiDexEnabled true `defaultConfig {` ` ``applicationId ``"com.haxi.mh"` ` ``minSdkVersion ``15` ` ``targetSdkVersion ``26` ` ``versionCode ``1` ` ``versionName ``"1.0.0"` ` ``testInstrumentationRunner ``"android.support.test.runner.AndroidJUnitRunner"` ` ``// dex突破65535的限制` ` ``multiDexEnabled ``true` ` ``ndk {` ` ``// 设置支持的SO库架构` ` ``abiFilters ``'armeabi'` `//, 'x86', 'armeabi-v7a', 'x86_64', 'arm64-v8a'` ` ``}` ` ``}` 2.兼容低版本(在build.gradle中 android代码库中,和defaultConfig同级) `//分包兼容低版本` `dexOptions {` ` ``javaMaxHeapSize ``"4g"` ` ``jumboMode = ``true` `}` 3.添加依赖包 `/* multidex兼容包,配合AndroidStudio实现了一个APK包含多个dex的功能 */` ` ``compile ``'com.android.support:multidex:1.0.1'` `4.让自己的Application继承MultiDexApplication类,或者在Application下重新attachBaseContext(Context base)方法,初始化 MultiDex.install(this); ` `@Override` `protected``void``attachBaseContext(Context base) {` ` ``super``.attachBaseContext(base);` ` ``MultiDex.install(base);` `}` 其他: 此外,有没有办法指定某些类被分包到主dex呢?有,在app目录下创建一个maindexlist.txt,我们在这个txt里将我们想要放在主dex中的类写进去即可,为了方便减少错误的出现,可以在在\app\build\intermediates\multi-dex\debug目录下找到了一个maindexlist.txt,注意,这个你直接在改了没用,一运行又恢复了,你要的做的是将这个maindexlist.txt复制到app目录下,在进行添加添加指定类即可, 参考: [https://www.2cto.com/kf/201712/707967.html](https://www.2cto.com/kf/201712/707967.html) [https://stackoverflow.com/questions/35225939/android-multidex-classnotfoundexception](https://stackoverflow.com/questions/35225939/android-multidex-classnotfoundexception) [http://blog.csdn.net/daitu_liang/article/details/72987378](http://blog.csdn.net/daitu_liang/article/details/72987378)

2018年2月28日 · 1 分钟 · 天边的星星

Nginx应用之Location路由反向代理及重写策略

一、常用设置 1、日志格式 log_format main '<span class="katex math inline">time_iso8601|</span>remote_addr|<span class="katex math inline">remote_user|</span>request_method|<span class="katex math inline">uri|' '</span>status|<span class="katex math inline">request_time|</span>request_length|<span class="katex math inline">body_bytes_sent|</span>bytes_sent|' '<span class="katex math inline">connection|</span>http_x_forwarded_for|<span class="katex math inline">upstream_addr|</span>upstream_status|' '<span class="katex math inline">upstream_response_time|</span>args|<span class="katex math inline">http_referer|</span>http_user_agent'; access_log logs/access.log main; 2、反向代理透传客户端IP设置 proxy_set_header Host <span class="katex math inline">http_host; proxy_set_header X-Real-IP</span>remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 3、全局变量 $args #这个变量等于请求行中的参数。 $content_length #请求头中的Content-length字段。 $content_type #请求头中的Content-Type字段。 $document_root #当前请求在root指令中指定的值。 $host #请求主机头字段,否则为服务器名称。 $http_user_agent #客户端agent信息 $http_cookie #客户端cookie信息 $limit_rate #这个变量可以限制连接速率。 $request_body_file #客户端请求主体信息的临时文件名。 $request_method #客户端请求的动作,通常为GET或POST。 $remote_addr #客户端的IP地址。 $remote_port #客户端的端口。 $remote_user #已经经过Auth Basic Module验证的用户名。 $request_filename #当前请求的文件路径,由root或alias指令与URI请求生成。 $query_string #与$args相同。 $scheme #HTTP方法(如http,https)。 $server_protocol #请求使用的协议,通常是HTTP/1.0或HTTP/1.1。 $server_addr #服务器地址,在完成一次系统调用后可以确定这个值。 $server_name #服务器名称。 $server_port #请求到达服务器的端口号。 $request_uri #包含请求参数的原始URI,不包含主机名,如:”/foo/bar.php?arg=baz”。 $uri #不带请求参数的当前URI,$uri不包含主机名,如”/foo/bar.html”。 $document_uri #与$uri相同。 二、Rewrite规则 ...

2018年2月17日 · 2 分钟 · 天边的星星