Was ist HTML5-Hybridentwicklung?-Front-End-Fragen und Antworten-php.cn

HTML5-Hybridentwicklung bezieht sich auf die Verwendung sowohl nativer (Programmiersprache) als auch H5-Technologien (Websprache). Hybridentwicklung ist ein Entwicklungsmodell, das aus den Stärken und Schwächen des anderen lernt. Der native Codeteil verwendet Plug-Ins oder andere Frameworks zur Bereitstellung von Containern für H5. Die Geschäftsimplementierung und die Schnittstellenanzeige werden alle mithilfe von H5-bezogenen Technologien implementiert.

Was ist HTML5-Hybridentwicklung?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, HTML5-Version, Dell G3-Computer.

Es gibt derzeit drei Arten von Mainstream-APPs auf dem Markt: native APP, Web-APP (d. h. HTML5) und Hybrid-APP. Die entsprechende kundenspezifische Entwicklung ist native Entwicklung, H5-Entwicklung und Hybrid-Entwicklung.

Was ist Hybridentwicklung?

Hybridentwicklung bezieht sich auf eine Hybridanwendung, die native und H5-Entwicklungstechnologien nutzt, um die Effizienz zu verbessern und Kosten bei der Entwicklung eines App-Produkts zu sparen. Laienhaft ausgedrückt ist dies das Modell einer Webseite, die sowohl in der Webseitensprache als auch in der Programmiersprache entwickelt wird. Es besteht normalerweise aus zwei Teilen: „H5-Cloud-Website + APP-Anwendungsclient“.

Hybrid-Entwicklung ist ein Entwicklungsmodell, das aus den Stärken des anderen lernt und seine Schwächen ergänzt. Der native Code-Teil verwendet Plug-Ins oder andere Frameworks, um Container für H5 bereitzustellen. Die Hauptgeschäftsimplementierung und Schnittstellenanzeige des Programms werden mit H5 implementiert -verwandte Technologien. Viele Apps werden mithilfe eines hybriden Entwicklungsmodells entwickelt.

Vorteile:

1. Hohe Entwicklungseffizienz und Zeitersparnis. Der gleiche Codesatz kann grundsätzlich auf Android und IOS verwendet werden.

2 Es ist bequemer, die Version zu aktualisieren und sie nur auf der Serverseite zu aktualisieren zum Hochladen in den App Store

3. Einfache Wartung, schnelle Versionsaktualisierungen

4. Kann offline ausgeführt werden.

Nachteile:

1. Funktionen/Schnittstelle können nicht angepasst werden, und die Schnittstelle kann nicht geändert oder Funktionen hinzugefügt werden;

2. Es müssen gemischte APP-Daten geladen werden Vom Server muss jede Seite erneut heruntergeladen werden, daher ist die Öffnungsgeschwindigkeit hoch, die Pufferzeit ist lang und es ist leicht, Benutzer abzuschrecken

3 Die Sicherheit ist relativ gering sind alles alte Codes und nicht gut kompatibel. Das Netzwerk entwickelt sich so schnell und es gibt so viele Viren. Wenn es nicht in Echtzeit aktualisiert und überprüft wird, ist es einfach Schlupflöcher zu schaffen und direkte wirtschaftliche Verluste zu verursachen;

Hybrid-APP-Prinzip

Bei der Hybrid-APP ist normalerweise das Front-End für den Großteil der Schnittstellenentwicklung und Geschäftslogik verantwortlich, und das native ist für die Kapselung der nativen Funktionen verantwortlich, die das Front-End aufrufen soll Verwenden Sie WebView als Kommunikationsmedium und profitieren Sie so von der Geschwindigkeit der Webentwicklung, den Vorteilen und starken nativen Funktionen. Aus Sicht eines Frontend-Entwicklers können Hybridanwendungen einfach so verstanden werden, dass sie die Ausführung der Frontend-Seite in einer speziellen Browserumgebung ermöglichen. Zusätzlich zur regulären Web-API bietet diese Umgebung auch viele zusätzliche Funktionen, die dies ermöglichen direkt auf dem Mobiltelefon aufgerufen werden.

Aus der Sicht eines nativen Entwicklers ist eine Hybridanwendung tatsächlich eine nativ entwickelte App-Shell. Diese Shell kapselt native Funktionen in viele APIs, fügt sie in WebView ein und packt dann die Front-End-Seite in die verwendete App Wenn die App startet, lädt WebView die Front-End-Seite und der Rest bleibt dem Front-End überlassen.

Webseiten interagieren mit iOS und Android (Prinzip)

Webseite ruft iOS und Android auf

Webseite sendet eine gefälschte Anfrage , ios, android Anfragen abfangen, analysieren, ob es sich um echte Anfragen oder gefälschte Anfragen handelt
Echte Anfragen werden freigegeben
- Gefälschte Anfragen werden abgefangen und die tatsächlichen Funktionsanforderungsfelder werden analysiert,
- an entsprechende Dateien übergeben Führen Sie entsprechende Vorgänge aus
Senden Sie eine gefälschte Anfrage für die native Entwicklung zum Abfangen (der URL-Pfad der Anfrage muss mit den iOS- und Android-Einstellungen übereinstimmen). Anfrage

// 继承类MyURLProtocol，子类NSURLProtocol
// MyURLProtocol.h文件
#import <Foundation/Foundation.h>

NS_ASSUME_NONNULL_BEGIN
@interface MyURLProtocol: NSURLProtocol



@end

Nach dem Login kopieren

// MyURLProtocol.m文件
#import "MyURLProtocol.h"
@implementation MyURLProtocol

// 手机app是否可以加载请求
+ (BOOL)canInitWithRequest:(NSURLRequest *)request{
    
    //拦截到请求后，获取请求的字符串
    NSString *path = request.URL.absoluteString;
    
    // 判断字符串是否以协商好的虚假协议开头（如emma://开头）
    if([path hasPrefix:@"emma://"]){
        // 这是个假请求
        // 获取该请求真实目的
        NSString *action = [path substringFromIndex:7];
        
        // 该文件不能调用一些原生功能，需要装有webview的视图文件才行，所以要将该请求字段传给视图文件
        // 文件间不能通信，用发布订阅（ios自带一个发布订阅）
        if([action isEqualToString:@"captureImage"]){
            // 发送消息，拍照
            [[NSNotificationCenter defaultCenter] postNotificationName:@"captureImage" object:nil userInfo:nil];
        }
        
        // 拦截掉该请求
        return NO;
    } else {
        // 真请求
        // 允许该请求通过
        return YES;
    }
}
    
@end

Nach dem Login kopieren

ios, Android übergibt den Wert an die Webseite

Bereiten Sie zunächst eine Rückruffunktion auf der Webseite vor, um das Ergebnis zu erhalten
Wenn der Native den Wert an die Webseite übergeben muss, fügen Sie dynamisch JS-Code in das Fenster ein Öffnet die Webseite. Der js-Code ist der Code, der die Rückruffunktion aufruft

native Entwicklung

native Entwicklung (native App-Entwicklung) ist die Verwendung offiziell bereitgestellter Entwicklungssprachen, Entwicklungsbibliotheken und Entwicklungstools für die App-Entwicklung auf mobilen Plattformen wie Android und IOS. Android verwendet beispielsweise Java, Eclipse und Android Studio; IOS verwendet Objective-C und Xcode für die Entwicklung.

Um es einfach auszudrücken, die einheimische Entwicklung ist wie der Bau eines Hauses. Zuerst wird das Fundament gelegt und dann werden die Bodenbalken gegossen. Die Struktur des Hauses, die Ziegel und Fliesen, der Stahlbeton, die Leitungsführung usw. werden sorgfältig geplant. Das Gleiche gilt für native APPs: Jede Seite, jede Funktion, jeder Effekt, jede Logik und jeder Schritt ist alles in Code geschrieben, Schicht für Schicht, Abschnitt für Abschnitt.

Vorteile:

1. Kann auf alle Funktionen des Mobiltelefons zugreifen (wie GPS, Kamera usw.), wodurch die umfassendsten Funktionen erreicht werden

3. Unterstützt eine große Anzahl von Grafiken und Animationen, keine Verzögerung, schnelle Reaktion; Lücken;

5 , es ist schneller, die vom Gerät bereitgestellte Schnittstelle zu nutzen, was Vorteile in der Verarbeitungsgeschwindigkeit hat.

Nachteile:

1. Die Entwicklungszeit ist lang, sie kann im schnellsten Fall in etwa fünf Monaten abgeschlossen sein.

3. Eine native App, Android und IOS müssen separat entwickelt werden, und die gleiche Logik und Schnittstelle muss in zwei Sätzen geschrieben werden

5. Benutzer müssen warten, bis der Download abgeschlossen ist, bevor sie ihn öffnen und neue Inhalte erhalten können. Bei der Versionierung müssen Sie das Anwendungsupdate erneut herunterladen.

Web-APP-Entwicklung (HTML5)

HTML5-Anwendungsentwicklung ist App-Entwicklung mithilfe von Web-Technologie. Eine Website, die in einem mobilen Browser geöffnet werden kann, wird als Web-App bezeichnet. Die Webtechnologie selbst erfordert die Unterstützung eines Browsers für die Anzeige und Benutzerinteraktion. Daher werden hauptsächlich HTML, CSS, Javascript und JS-Frameworks wie jQuery, Vue und React verwendet.

Vorteile: 1. Unterstützt eine Vielzahl von Geräten und kann plattformübergreifend ausgeführt werden.

3. Keine Inhaltsbeschränkungen;

Es ist für die Anzeige von Seiten mit großen Textabschnitten (z. B. Nachrichten, Strategien usw.) und umfangreichen Formaten (z. B. Fettdruck, verschiedene Schriftarten) geeignet Verwenden Sie direkt die neueste Version (automatisches Update, kein manuelles Update durch den Benutzer erforderlich).

Nachteile:

1. Aufgrund der Einschränkungen der Web-Technologie selbst können H5-Mobilanwendungen nicht direkt auf Gerätehardware und Offline-Speicher zugreifen, daher gibt es große Einschränkungen in Bezug auf Erfahrung und Leistung.

2 Hohe Netzwerkanforderungen kann ausgeführt werden;

4. Die Reaktionsgeschwindigkeit der APP ist schlecht.

5 ;

7. Mobiltelefon-Hardware (Kamera, Mikrofon usw.) kann nicht aufgerufen werden.

Verwandte Empfehlungen: „

HTML-Video-Tutorial

“

Das obige ist der detaillierte Inhalt vonWas ist HTML5-Hybridentwicklung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!