(고성능 웹 앱에 대한 요구 사항

'고성능 웹 앱' 또는 '프런트엔드'란 정확히 무엇인가요?

Internet Explorer 시대가 쇠퇴한 이후 JavaScript 생태계는 점점 더 강력해졌고 "프런트엔드"라는 용어는 고성능 최신 웹 클라이언트의 동의어가 되었습니다. 이 "프론트엔드" 세계의 핵심에는 React가 있습니다. 실제로 프론트엔드 개발에 React를 사용하지 않으면 이상치처럼 보일 때가 많습니다.

그러나 모든 게임이 AAA인 것은 아니듯이, 웹 앱을 논의할 때 '고성능'이 무엇을 의미하는지 신중하게 고려해야 합니다. 이러한 구별은 오늘의 주제에 매우 중요합니다.

1. 고성능 웹 앱의 범위

대부분의 경우 "고성능 웹 앱"이라는 용어는 React, Vue 또는 Angular와 같은 JavaScript 기반 프레임워크를 사용하여 구축된 대화형 동적 웹 클라이언트를 의미합니다. 이러한 앱은 일반적으로 빠른 로드 시간과 클라이언트 측 라우팅을 자랑하며 React의 가상 DOM은 렌더링 속도를 향상시키는 데 중요한 역할을 합니다.

그러나 WASM 모듈의 메모리 한도인 4GB를 모두 활용하고 체계적인 메모리 관리를 염두에 두고 구축되었으며 Blender나 3Ds Max와 같은 기본 프로그램과 동등한 성능을 목표로 하는 웹 앱이 있습니다. 이러한 앱은 SEO에 최적화된 기존의 "웹 페이지"보다는 브라우저 탭의 모든 리소스를 활용하는 "프로그램" 개념에 더 부합합니다.

현재 브라우저 환경에서는 메모리 제한과 오버헤드로 인해 기본과 유사한 성능을 제공하는 데 여전히 어려움을 겪을 수 있지만 이러한 앱의 목표는 근본적으로 다릅니다. 대규모 데이터 세트를 처리하고 2~4GB의 전체 메모리를 사용하는 동시에 가장 높은 렌더링 속도를 추구하는 것을 목표로 합니다.

이러한 유형의 웹 앱이 직면한 문제가 일반적인 '고성능' 앱이 직면한 문제와 다르기 때문에 추구하는 방향도 다릅니다.

처음에 언급한 '고성능 웹 앱'과 여기서 설명하는 앱은 근본적으로 그 경로가 다릅니다. 이들을 단일 용어로 묶는 것은 문제가 될 수 있습니다. 이러한 차이점을 반영하려면 다른 용어가 필요합니다.

이것이 바로 후자를 "고성능 웹 앱" 또는 "프론트엔드"로 언급하는 것을 중단하고 대신 다음 용어를 사용할 것을 제안하는 이유입니다.

• 브라우저 기반 고성능 프레임워크 엔지니어링(BBHPFE)
• (브라우저 기반) 고성능 시스템 엔지니어링(HPSE)

이 용어는 프런트엔드와 HPSE 간의 요구 사항 차이를 명확하게 정의한다고 생각합니다. 모든 브라우저 기반 클라이언트가 프런트엔드인 것은 아닙니다. 일부는 HPSE입니다. 이러한 구별이 왜 중요한지 이해하려면 다음 예를 고려하십시오.

[대화 1]

A: "프론트엔드 앱을 개발 중이지만 React를 사용하고 있지 않습니다."
B: "React가 없는 프런트엔드 앱? React는 프런트엔드 시장 점유율이 60%가 넘습니다. 왜 사용하지 않겠습니까?"

[대화 2]

A: "HPSE 앱을 개발 중이지만 React를 사용하고 있지 않습니다."
B: "HPSE에는 맞는 말입니다. 게임 회사는 종종 엔진을 광범위하게 사용자 정의하지만 React의 내부 기능과 렌더링 파이프라인은 수정할 수 없습니다. 그런 목적으로 설계된 적이 없습니다."

이제 HPSE가 갖춰야 할 필수 구성 요소에 대해 살펴보겠습니다.

2-1. 메모리 관리
메모리를 다루지 않고서는 고성능 프로그램을 논할 수 없습니다. 가비지 컬렉터를 사용하든 동적으로 할당된 메모리를 수동으로 해제하든 사용되지 않는 메모리는 항상 해제되어야 합니다.

플레이어가 새로운 지도로 이동하는 브라우저 기반 게임을 생각해 보세요. 게임은 서버에서 비동기식으로 새 지도 데이터를 가져와서 새 메시를 생성하고 이전 메시를 제거해야 합니다. 이전 메시를 생성하는 데 사용된 데이터도 해제해야 합니다.

이전 데이터에 대한 참조가 제대로 해제되지 않으면 맵이 전환될 때마다 메모리 사용량이 계속 증가합니다. 약 2GB에 도달하면 "메모리 부족" 오류가 발생할 수 있으며 브라우저가 충돌합니다.

JavaScript가 낮은 수준의 메모리 제어를 위해 설계되지 않은 것은 사실입니다. 언어나 개발자의 철학 모두 이를 우선시하지 않습니다. 메모리 관리가 항상 중요하다는 말은 아니지만, "공짜 점심 같은 건 없다"는 말이 있습니다. 메모리 관리가 필요하다면 반드시 해줘야 합니다.

2-2. 요구 사항 충족의 유연성
누군가가 "주니어 개발자에서 중급 개발자로 넘어갈 즈음에는 요청하는 모든 것을 구축할 수 있을 것입니다."라고 말하는 것을 들은 적이 있습니다.

JavaScript는 이미 고유한 제한(메모리 제한 제외)이 거의 없는 인상적인 언어입니다. 무언가를 만들고 싶다면 아마도 이루어질 수 있을 것입니다.

Persoalan sebenar ialah sama ada projek semasa anda benar-benar dapat menampung pelbagai keperluan.

Sama seperti mesin di kilang rosak selepas operasi berterusan, mengejar prestasi tinggi, ciri tersuai pasti membawa kepada menghadapi cabaran yang tidak dijangka. Apabila ini berlaku, fleksibiliti dan keupayaan untuk memenuhi keperluan unik adalah penting.

Sebagai contoh, pernahkah anda mendengar bahawa Lost Ark dibina pada Unreal Engine 3? Enjin Unreal 5 telah dikeluarkan sekarang, namun mereka masih menggunakan Enjin Unreal 3, yang telah dicipta pada tahun 2004. Untuk mengekalkan projek itu sehingga kini, mereka mesti telah membuat pengubahsuaian yang meluas pada enjin—secara praktikalnya adalah baik pulih sepenuhnya. Disebabkan oleh ciri permainan, mereka perlu sentiasa menyesuaikan saluran paip dan gelung pemaparan dengan teknik seperti pemaparan tertunda, contoh, pemusnahan dan pantulan ruang skrin untuk memenuhi keperluan prestasi dan estetik.

Keupayaan untuk mengubah suai kod sumber enjin adalah kritikal. Jika enjin telah ditutup atau digandingkan terlalu ketat untuk membenarkan pengubahsuaian, Lost Ark mungkin tidak pernah dibangunkan.

HPSE adalah sama. Walaupun persekitaran telah berubah kepada berasaskan pelayar, keperluan untuk fungsi tersuai dan pengubahsuaian fleksibel tetap sama. Oleh itu, perpustakaan dan modul luaran yang digunakan dalam HPSE mesti boleh diubah suai, dan jika saluran paip pemaparan penyemak imbas atau gandingan modul dalaman terlalu tegar untuk membenarkan perubahan ini, ia menjadi masalah yang ketara.

2-3. Pendekatan Berorientasikan Objek Yang Tidak Dapat Dielakkan
Apabila berurusan dengan program berskala besar, satu perkara menjadi tidak dapat dielakkan: pengaturcaraan berorientasikan objek (OOP).

JavaScript ialah bahasa berbilang paradigma, dan pengaturcaraan berfungsi (FP) digunakan secara meluas. Walau bagaimanapun, FP, walaupun sesuai untuk pelanggan web, jarang digunakan dalam program berskala besar di mana berbilang objek berinteraksi dengan cara yang kompleks kerana kejadian dalam FP tidak mempunyai keadaan dalaman.

React mengimbangi perkara ini dengan pengurusan keadaan global dan useEffect, tetapi ia tidak seintuitif setiap kejadian mengekalkan keadaan sendiri dan kaedah mengawal panggilan melalui kaedah awam.

Walaupun OOP bukanlah pilihan terbaik, sukar untuk memikirkan alternatif yang lebih baik apabila mempertimbangkan keperluan pembangunan HPSE yang sangat disesuaikan. Banyak program berskala besar, termasuk sistem pengendalian dan permainan, dibina menggunakan prinsip OOP. Malah sumber enjin yang paling popular adalah berorientasikan objek, dengan variasi kecil dalam metodologi.

Pembangun yang telah mengambil bahagian dalam projek berskala besar berkemungkinan biasa dengan OOP. Ini menjadikan pembangunan berasaskan OOP kondusif untuk kerjasama.

Yang berkata, tidak perlu membuang kekuatan JavaScript. Memandangkan JavaScript menyokong fungsi dan pengisytiharan const, fungsi modul ringkas yang tidak memerlukan contoh boleh ditakrifkan sebagai literal objek menggunakan const atau fungsi. Ini boleh meningkatkan produktiviti dan memanfaatkan kepelbagaian JavaScript.

Sebagai kesimpulan, saya percaya bahawa pendekatan pelbagai paradigma, menggabungkan prinsip berorientasikan objek, akan sesuai untuk HPSE.

위 내용은 (고성능 웹 앱에 대한 요구 사항의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!