Chimera Flutter Code Push thermal Update
One, foreword
In today’s era of programming languages where a hundred flowers bloom and a hundred schools of thought contend, whoever can occupy the market of mobile App development will be favored by major manufacturers; When it comes to mobile development, if anyone can make a breakthrough in cross-platform technology, that person will be the best of the hundreds of languages. The Google-led development of Flutter is known for its “multi-endpoint consistency” and “rendering performance” that puts other cross-endpoint solutions to the test.
Flutter support all existing knowledge platform (iOS, android, Windows, Linux, Web.) , and support a set of code platform – wide one-click deployment.
However, due to performance and safety concerns, Google voluntarily withdrew support for the dynamic thermal update of Flutter in April 2019, leaving the “superframework” of Flutter weak. In order to meet the market demand and technological breakthrough, our Viton Technology Chimera team started the project research on Flutter dynamic update at the end of 2019. By the beginning of December this year, our SDK and docking plan for Flutter dynamic thermal update had been completed, and the product code was also “Chimera”.
What is Chimera?
Chimera is a mythical Greek beast. It is a hybrid with the head of a lion, the body of a goat, and the tail of a boa constrictor.
Just like Chimera, our products can provide a complete set of integrated embedded solutions for various platforms. Our SDK has the advantages and characteristics of easy access, easy integration and easy compilation. Whether your APP is in the early development stage or has been developed, it is seamless access with one click. At the same time, the entire code integration and compilation process can be described as “dumb” intervention. Our products provide fine-grained thermal update capabilities to fix in-app issues without waiting for a release, leaving the end user completely unbothered.
2.1 Product Advantages
- Universal, instant one-click access to existing Flutter projects without any impact on the source App development process
- Low-cost, dynamic alignment of Flutter ecology and common development practices, and low-cost conversion of existing Flutter pages
- Applicability, wide repair range, small size of compilation package, no intrusion, no third-party language intervention, high performance, keep the performance of Flutter App, without any performance impact loss
- Good service, one-stop overall experience, support for dual-end commercialization platform, with high reusable development experience
Our Github open source address:Github.com/Waytoon/chi…
2.2 Specific process:
Chimera Flutter Thermal Update (CodePush) is an SDK that has been under development for over 2 years for enhancement and refinement of Flutter applications, code thermal updates.
As you know, the Google Flutter team has announced that Flutter will not support the code push feature in its engine.
Google notes here:
This was previously on our roadmap for 2019. After investigating this in greater detail, we have decided not to proceed with this work for now.
There were several factors that led us to this decision:
- To comply with our understanding of store policies on Android and iOS, any solution would be limited to JIT code on Android and interpreted code on iOS. We are not confident that the performance characteristics of such a solution on iOS would reach the quality that we demand of our product. (In other words, “it would be too slow”.)
- There are some serious security concerns. Since these patches would essentially allow arbitrary code execution, they would be extremely attractive malware vectors. We could mitigate this by requiring that patches be signed using the same key as the original package, but this is error prone and any mistake would have serious consequences. This is, fundamentally, the same problem that has plagued platforms that allow execution of code from third-party sources. This problem could be mitigated by integrating with a platform update mechanism, but this defeats the purpose of an out-of-band patching mechanism.
- There is currently no out-of-the-box open source hosting solution for patching applications, so we would either have to rely on people configuring their Web servers accordingly, or we would have to create integrations for proprietary third-party services, or we would have to create our own bespoke solution. Hosting patches is a space we are not eager to enter. Having people configure their own server leaves them open to making mistakes with potentially serious implications as explained in the previous point about security. Depending on third-party services puts Flutter in an awkward position of having to pick winners and exposes us to the risk of those projects themselves making policy changes that would affect this feature.
As a result, Chimera Flutter CodePush was already initiated and developed at that time: Chimera CodePush is a cloud service that enables Flutter developers to deploy mobile application updates directly to their users’ devices. It acts as a central repository to which developers can publish updates and from which applications can query for updates. This allows you to model more deterministic and direct engagement with your user base when fixing bugs and/or adding small features that don’t require rebuilding binaries and redistributing binaries through their respective app stores.
Chimera can bundle UI/Logic /.. The changes (all you want) are distributed to users in a way similar to other open source hot update projects, but different. By integrating Flutter Chimera, you can publish all application pages without waiting for the next release date of your application. Chimera provides an excellent compiler that can be used as a new magic tool to convert, run, and upgrade Flutter pages/applications. Our SDK is based on Dart native language and does not use any third party language for development. Therefore, using our SDK is very friendly to flutter developers. There is no learning cost for you.
To get started with Chimera CodePush, refer to this document, and read the steps below if you want to build/contribute projects from source code.
The Chimera SDK will support all applications written with Flutter. Please do not hesitate to start pushing the SDK with this super code. Dev Setup
2.3 DEV Setup
Here we go:
๐ฉ You may need to become an excellent Flutter programmer or a Flutter programming enthusiast, like me :-), mainly familiar with Flutter programming, and have a desire to study and learn.
Set the Flutter code environment: here.
You need a handy IDE. Android Studio or VSCODE is recommended. Note: Before git clones this repository, it is best to install “Git Large File Storage” (git-lfs.github.com/). It helps you process and synchronize large files to avoid any data flow loss.
Remember to install http-server, because future work will require http-server:
brew install http-server
Copy the codeThe killer is here, our compiler! This compiler is the main tool to service Chimera CodePush.
# compiler tools download link to download the link: https://github.com/Waytoon/chimera_flutter_code_push/releases/download/v1.0.0/rust_compileCopy the codeFor Chinese users, you can refer to the link below to speed up the download of GitHub files.
Speedy access github
The following environments are not supported by the current SDK:
Windows
Important: Compilers need to be networked to run. Full Mac support, including M1.
๐ Check the runtime environment on your computer. Chimera is based on the latest stable version of Flutter. And the SDK will continue to support the latest stable Flutter versions in the future.
Flutter. Dev/docs/develo…
Our version of Flutter (stable version)
๎ฐ ~ / Desktop/tool ๎ฐ flutter - version flutter 1.22.6, channel stable, https://github.com/flutter/flutter.git Framework โข Revision 9B2D32B605 (6 weeks ago) โข 2021-01-22 14:36:39-0800 Engine โข Tools โข Dart 2.10.5Copy the codeIf you are using FLUTTER 2, please switch to flutter 1.22.6 stale first
Switch methods please at terminal run flutter downgrade
2.4 Use CodePush SDK
-
First run mkdir test to create a test folder. The diagram below:
CD test Enter the test directory to create a hello project: flutter create Hello.
The hello directory structure is as follows:
.Folder โโโ Android โโโ Iml โโโ Ios โโโ PubSpecCopy the code
2. Open hello project with IDE:
Be careful here!! Debug the Hello project once using the IDE, whether using a simulator or a real machine, using the simulator as an example.
-
An important step is to download our compiler, link:
https://github.com/Waytoon/chimera_flutter_code_push/releases/download/v1.0.0/rust_compile
Please pay attention to the release file in the Release section. We will update the compiler every night for a while now.
Download to a specific directory, give it a name, let’s use tool:
Then open the terminal, go to the directory of the compiler, and run the command chmod 777 rust_compile to make the compiler have permission to run
The next step is to run in the terminal.
The first time you run the compiler, the config file config.yaml is generated.
-
After running, you will be prompted to configure config.yaml, as shown in the figure above.
Open config.yaml and configure the following:
# Project path
projectPath: /Users/ryanliu/Desktop/test/hello # change the directory to Hello
# Flutter SDK
flutterSdkPath: /Users/ryanliu/development/flutter Modify the SDK directory of the current Flutter environment
# Compile cache path
buildCachePath: /Users/ryanliu/Desktop/temp/dart_compile_cache Set a special directory to hold dart_compile_cache
# FTP
# ftpConfig: 192.168.80.141 | root | 123456 here can be ignored
Copy the code-
Then run it again in the terminal./rust_compile executes our compilation process.
After about 2-5 minutes, you can get the following image. The compiled product hello. Bin is in the project hello/assets/ directory, with the wtBase library directory.
We can see that the hello folder directory is changed to, notice that there are two new folders assets and wtBase in the directory:
โ โ โ the README. Md โ โ โ android โ โ โ assets โ โ โ build โ โ โ hello.html on iml โ โ โ ios โ โ โ lib โ โ โ pubspec. Lock โ โ โ pubspec. Yaml โ โ โ the test โ โ โ wtbaseCopy the code -
This next step is very important! Yaml: flutter_code_push: flutter_code_push: flutter_push:
flutter_code_push:
git:
url: https://github.com/Waytoon/chimera_flutter_code_push.git
path: flutter_code_push
Copy the codeThe original configuration:
After modification:
Remember to click pub get above, or enter flutter pub get in terminal.
- Then change
hello/pubspec.yamlIn thedependenciesAdd as follows:
wtbase: path: ./wtbase
< span style = “max-width: 100%; clear: both; min-width: 1em;
hello/pubspec.yaml:
hello/wtbase/pubspec.yaml:
Remember to run flutter pub get, or click the pub GET button.
Note: Please run firstwtbaseThe directoryPub getAnd then runhelloThe projectPub get. The purpose of this is to ensure that the version numbers of the project’s dependent libraries are consistent.
Now that the initial SDK configuration is complete, let’s show you how to use and implement hot updates in our Source code.
- Now in the
hello/libDirectory creationMyApp.dartThe file Source code is as follows:
import 'package:flutter/material.dart';
import 'package:dio/dio.dart';
void initApp() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
// This makes the visual density adapt to the platform that you run
// the app on. For desktop platforms, the controls will be smaller and
// closer together (more dense) than on mobile platforms.
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page')); }}class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
// This widget is the home page of your application. It is stateful, meaning
// that it has a State object (defined below) that contains fields that affect
// how it looks.
// This class is the configuration for the state. It holds the values (in this
// case the title) provided by the parent (in this case the App widget) and
// used by the build method of the State. Fields in a Widget subclass are
// always marked "final".
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
String _response;
void _incrementCounter() {
setState(() {
// This call to setState tells the Flutter framework that something has
// changed in this State, which causes it to rerun the build method below
// so that the display can reflect the updated values. If we changed
// _counter without calling setState(), then the build method would not be
// called again, and so nothing would appear to happen.
_counter++;
});
}
void _getHttp() async {
try {
Response response = await Dio().get("http://www.google.com");
setState(() {
String temp = '$response';
for (var i = 0; i < 10; ++i) {
temp = '$i' + temp;
}
_response = temp.substring(0.100);
});
} catch (e) {
print(e); }}@override
void initState() {
_getHttp();
super.initState();
}
@override
Widget build(BuildContext context) {
// This method is rerun every time setState is called, for instance as done
// by the _incrementCounter method above.
//
// The Flutter framework has been optimized to make rerunning build methods
// fast, so that you can just rebuild anything that needs updating rather
// than having to individually change instances of widgets.
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text(widget.title),
),
body: Center(
// Center is a layout widget. It takes a single child and positions it
// in the middle of the parent.
child: Column(
// Column is also a layout widget. It takes a list of children and
// arranges them vertically. By default, it sizes itself to fit its
// children horizontally, and tries to be as tall as its parent.
//
// Invoke "debug painting" (press "p" in the console, choose the
// "Toggle Debug Paint" action from the Flutter Inspector in Android
// Studio, or the "Toggle Debug Paint" command in Visual Studio Code)
// to see the wireframe for each widget.
//
// Column has various properties to control how it sizes itself and
// how it positions its children. Here we use mainAxisAlignment to
// center the children vertically; the main axis here is the vertical
// axis because Columns are vertical (the cross axis would be
// horizontal).
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
Text(
'Server Response:\n$_response'
)
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.); }}Copy the codeAfter adding the file, run the flutter pub get to make sure the dependencies are imported correctly.
Then we modify the main.dart file as follows:
```dart import 'package:hello/MyApp.dart'; import 'package:wtbase/wtbase.dart'; import 'package:flutter/material.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); bool isNative = false; if (isNative) { initApp(); } else { String downloadUrl = "http://yourlocalhost/hello.bin"; readCode = WTAnalysisReadCode(); await readCode.loadFile(downloadUrl); readCode.executeMethod( 'package:hello/MyApp.dart', 'initApp'); }} ` ` `Copy the codePlease note that the downloadUrl now only supports Intranet tests. The downloadUrl must start with http://192.168.
To support extranet requests, please contact [email protected].
Another crucial step:
Open terminal and enterhello/assetsDirectory:
Enter http-server-c-1 in terminal
The results are as follows:
Copy the HTTP server – the links below, my is http://192.168.80.115:8080, is used to modify the main. In the dart
String downloadUrl = "http://yourlocalhost/hello.bin";
Copy the codeModified to:
String downloadUrl = "http://192.168.80.115:8080/hello.bin";
Copy the codeThis is the end of the access process.
- The next thing to do is run your APP from the IDE by clicking on the green bug.
The IDE compiles without any problems, not surprisingly. This is what it looks like on the simulator.
The debug console log of DE is as follows:
Launching lib/main.dart on Android SDK built for x86 in debug mode...
Running Gradle task 'assembleDebug'. โ Built build/app/outputs/flutter - apk/app - debug. Apk. Installing the build/app/outputs/flutter - apk/app. The apk... Waitingfor Android SDK built for x86 to report its views...
Debug service listening on ws:/ / 127.0.0.1:65046 / r1MGSW - wdg4 = / ws
Syncing files to device Android SDK built for x86...
W/m.example.hell( 6898): Accessing hidden method Lsun/misc/Unsafe; ->getUnsafe()Lsun/misc/Unsafe; (greylist,core-platform-api, linking, allowed) W/m.example.hell(6898): Accessing hidden method Lsun/misc/Unsafe; ->objectFieldOffset(Ljava/lang/reflect/Field;) J (greylist,core-platform-api, linking, allowed) W/m.example.hell(6898): Accessing hidden method Lsun/misc/Unsafe; ->compareAndSwapObject(Ljava/lang/Object; JLjava/lang/Object; Ljava/lang/Object;) Z (greylist, linking, allowed) W/m.example.hell(6898): Accessing hidden method Lsun/misc/Unsafe; ->putObject(Ljava/lang/Object; JLjava/lang/Object;) V (greylist, linking, allowed) D/EGL_emulation(6898): eglMakeCurrent: 0xd7a8e900: ver 3 0 (tinfo 0xdaf0f820)
D/eglCodecCommon( 6898): setVertexArrayObject: set vao to 0 (0) 1 0
I/flutter ( 6898): download file!
I/flutter ( 6898): vmClassName: MyApp className: WTStatelessWidget1
I/flutter ( 6898): vmClassName: MyHomePage className: WTStatefulWidget1
I/flutter ( 6898): vmClassName: _MyHomePageState className: WTState1
Copy the code- The rest is up to you. Let’s say we modify
MyApp.dartTry the code in. Modify thefloatingActionButtonTry it on:
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
Copy the codeChange Icons. Add to icons.home. When finished, it looks like this:
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.home),
),
Copy the codeSave your changes, then go back to terminal, go to your compiler directory, and run./rust_compile:
After running this command and waiting for some time, the final effect is as follows:
Note here, we don’t need the IDE to do anything here, just close the currently running app in the emulator, open it again, and you’ll see it looks like this:
Again, we didn’t use any IDE functionality so far, we just compiled the new hello.bin file with our own compiler and remotely loaded the bin file through the emulator.
### This is a full hot update APP.
At this point, you’ve developed an App with hot updates. Isn’t that amazing? ! Feel free to change some of your code now, and be sure to compile it again (repeat Step 10).
If you like, give us a star โจ!
## Note:
First: For Android app release:
For Android App development, it is important to give the App network and storage permissions in advance. Modify the hello/app/SRC/main/AndroidManifest. The XML
โ
Second: for iOS app release:
For iOS App development: use the “Architectures” setting to add, “arm64&x86_64”. Otherwise you’ll get an error when you compile.
The modification steps are as follows:
The initial default looks like this:
Modify process: first click other,
The following window appears:
Then click + to appear the following:
Output arm64 in the text box. Press + again to add x86_64; Two terms are going to be added.
Finally, select $(ARCHS_STANDARD) and click – in the image above to delete $(ARCHS_STANDARD).
End result:
Note that if the Architectures are being compiled for iOS and XCODE is reporting a compilation error associated with the.a file of x86_64, delete the Architectures’ x86_64 and run the XCODE publication again. Removing x86_64 will no longer support iOS emulators.
As a reminder, if you want to deploy your APP to your iPhone without using an iPhone cable to connect to your computer, please Profile your APP to your phone and the XCODE shortcut is
โ + I.
Issues you may encounter with an Android APK release:
If you use the Flutter build APk, you will get the following error when releasing the Android APK:
This application cannot tree shake icons fonts. It has non-constant instances of IconData at the following locations:
- file:///Users/ryanliu/Desktop/test/hello/wtbase/lib/generate/mapping/WTVMIconData.dart:31:12
Copy the codeRun the following command to publish apK:
flutter build apk --no-tree-shake-icons
Copy the codeYou won’t see that mistake again.
Relevant introduction materials
For more information, we’ll include the following links:
- Chimera Flutter Code Push Instruction
๐ฃ๏ธ our plans for 2021
- Spring ยท Open source on high-speed rail in 2021
- Project launch โ
- Introduction โ
- Making open source github.com/Waytoon/chi… โ
- The next generation magic V2 in 2021
- Achieve differentiation and renewal
- Full AOT support
- AI intelligent compiler
โ ๏ธ unsupported content??
- Now it is immodest to say that we support all the Flutter syntax and Pub libraries.
- There may be some unexpected bugs, we don’t want to, so let’s go kill them all together,DE Marcia!
๐ง you can join us if you like!
We warmly welcome brothers and sisters from all over the world to join us. We need your support and help in the community. Welcome to our github homepage: github.com/Waytoon/chi… Please like and share your comments. Thanks again!
Welcome to join us by scanning the following code:
- You can add SDK group main WX: search
novolei