[{"data":1,"prerenderedAt":136},["ShallowReactive",2],{"site":3,"blog-post-en-fivem-ui-lag":15,"blog-slug-site":48,"blog-scripts-en-fivem-ui-lag":54},{"site":4,"contact":10,"seo":13,"payment":14},{"name":5,"host":6,"default_locale":7,"locales":8},"X3D Developer","fivem.x3d-developer.com","th",[7,9],"en",{"discord_invite":11,"email":12,"line":12},"https:\u002F\u002Fdiscord.gg\u002FNA5kPVynFv","",{"google_site_verification":12,"bing_site_verification":12},{"bank_name":12,"account_name":12,"account_no":12,"promptpay_id":12},{"post":16,"html":21,"others":22,"productSlugs":44},{"slug":17,"title":18,"description":19,"date":20},"fivem-ui-lag","FiveM UI Lag Fix: Why NUI Eats FPS and How to Stop It (2026)","UI lag in FiveM: FPS drops when the inventory opens, notifications arrive late, the HUD stutters. The real causes are several NUIs rendering at once, messages sent every frame, fonts and CSS loaded from the internet, and progress bars that do not lock other UIs. How to measure it, and the free UI scripts that already fix it.","2026-09-24","\u003Cp>Players say &quot;the server is laggy&quot;, but the server pings 20 ms with 70% CPU free. Almost every time the problem is \u003Cstrong>client-side UI\u003C\u002Fstrong>, not the server. Every NUI is a Chromium web page running on top of the game; the more of them, and the more that work all the time, the more frames you lose. This post shows how to find the culprit and what a good UI has to do.\u003C\u002Fp>\n\u003Ch2 id=\"measure-which-one-is-eating\">Measure which one is eating\u003C\u002Fh2>\n\u003Col>\n\u003Cli>Press \u003Cstrong>F8\u003C\u002Fstrong>, type \u003Ccode>resmon 1\u003C\u002Fcode>: a per-resource client CPU table in ms. Anything above 0.1 ms while standing still is suspicious\u003C\u002Fli>\n\u003Cli>Watch \u003Ccode>resmon\u003C\u002Fcode> \u003Cstrong>while a UI is open\u003C\u002Fstrong> (inventory, menu). If a resource jumps from 0.05 to 2–5 ms, that UI sends messages too often or paints too much\u003C\u002Fli>\n\u003Cli>\u003Ccode>stop &lt;resource&gt;\u003C\u002Fcode> one at a time and watch the frame rate; you find the culprit within five minutes\u003C\u002Fli>\n\u003Cli>Count the NUIs that stay open: HUD, notifications, progress bar, menu, inventory, phone. If each is a full Vue\u002FReact app and \u003Cstrong>renders all the time\u003C\u002Fstrong> (\u003Ccode>SetNuiFocus\u003C\u002Fcode> is irrelevant; rendering alone costs), six of them take 15–20 FPS on a mid-range machine\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Ch2 id=\"six-common-causes\">Six common causes\u003C\u002Fh2>\n\u003Ch3 id=\"1-sendnuimessage-every-frame\">1. SendNUIMessage every frame\u003C\u002Fh3>\n\u003Cp>Many HUDs push health\u002Fhunger\u002Fmoney to the NUI inside \u003Ccode>while true do Wait(0)\u003C\u002Fcode>: JSON serialisation plus a cross-process hop 60 times a second for one HUD. Fix: send only when a value changes, and \u003Ccode>Wait(200–500)\u003C\u002Fcode> for anything that is not real-time\u003C\u002Fp>\n\u003Ch3 id=\"2-fonts-css-js-loaded-from-the-internet\">2. Fonts \u002F CSS \u002F JS loaded from the internet\u003C\u002Fh3>\n\u003Cp>A UI that \u003Ccode>@import\u003C\u002Fcode>s Google Fonts or pulls a CDN \u003Cstrong>waits on the network\u003C\u002Fstrong> on first open, and on blocked or slow connections renders boxes instead of Thai (or any non-Latin) glyphs. Every asset must ship inside the resource. \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-notify\u002F\">X3D Notify\u003C\u002Fa> and \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-progressbar\u002F\">X3D Progress Bar\u003C\u002Fa> embed Noto Sans Thai and make zero outbound requests\u003C\u002Fp>\n\u003Ch3 id=\"3-overlapping-nuis\">3. Overlapping NUIs\u003C\u002Fh3>\n\u003Cp>The old \u003Ccode>esx_notify\u003C\u002Fcode> and the new one running together show notifications twice and cost double. Remove the old one entirely; if legacy scripts call \u003Ccode>exports['esx_notify']\u003C\u002Fcode>, use the 12-line forwarder in X3D Notify's \u003Ccode>optional\u002F\u003C\u002Fcode> instead of running two\u003C\u002Fp>\n\u003Ch3 id=\"4-progress-bars-that-do-not-lock-other-uis\">4. Progress bars that do not lock other UIs\u003C\u002Fh3>\n\u003Cp>During a repair the player can open the inventory, the menu and the phone; three or four UIs render at once, which both eats frames and opens dupe windows. The fix is a progress bar that announces its state. \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-progressbar\u002F\">X3D Progress Bar\u003C\u002Fa> sets the \u003Ccode>LocalPlayer.state.minigame\u003C\u002Fcode> state bag and fires \u003Ccode>x3d_progressbar:active\u003C\u002Fcode>; every other UI checks one line:\u003C\u002Fp>\n\u003Cpre>\u003Ccode class=\"language-lua\">if LocalPlayer.state.minigame then return end\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3 id=\"5-heavy-animation-blur-backdrop-filter\">5. Heavy animation \u002F blur \u002F backdrop-filter\u003C\u002Fh3>\n\u003Cp>Full-screen \u003Ccode>backdrop-filter: blur()\u003C\u002Fcode> and stacked box-shadows on elements that move every frame force the Chromium layer over the game to recomposite the whole screen. Blur only small boxes, animate with \u003Ccode>transform\u003C\u002Fcode>\u002F\u003Ccode>opacity\u003C\u002Fcode> instead of \u003Ccode>top\u002Fleft\u003C\u002Fcode>, and set \u003Ccode>will-change\u003C\u002Fcode> only while animating\u003C\u002Fp>\n\u003Ch3 id=\"6-uis-that-are-not-really-closed\">6. UIs that are not really closed\u003C\u002Fh3>\n\u003Cp>Hidden with \u003Ccode>display:none\u003C\u002Fcode> in JS while Lua keeps sending messages and Vue stays reactive. Stop the Lua loop too when the UI closes\u003C\u002Fp>\n\u003Ch2 id=\"what-a-good-ui-needs\">What a good UI needs\u003C\u002Fh2>\n\u003Cdiv class=\"table-scroll\">\u003Ctable>\n\u003Cthead>\n\u003Ctr>\n\u003Cth>Requirement\u003C\u002Fth>\n\u003Cth>Why\u003C\u002Fth>\n\u003C\u002Ftr>\n\u003C\u002Fthead>\n\u003Ctbody>\n\u003Ctr>\n\u003Ctd>Embedded fonts\u003C\u002Ftd>\n\u003Ctd>No tofu boxes, no waiting on the network\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>Zero outbound requests\u003C\u002Ftd>\n\u003Ctd>First open does not hang\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>Messages only on change\u003C\u002Ftd>\n\u003Ctd>No frame cost while idle\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>Announces state (state bag)\u003C\u002Ftd>\n\u003Ctd>Other UIs stop overlapping on their own\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>Cancellable (ESC)\u003C\u002Ftd>\n\u003Ctd>Players never get stuck in a bar\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>Drop-in replacement without script edits\u003C\u002Ftd>\n\u003Ctd>Switching does not break the server\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003C\u002Ftbody>\n\u003C\u002Ftable>\n\u003C\u002Fdiv>\n\u003Cp>X3D's three free UI scripts meet the table: \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-notify\u002F\">X3D Notify\u003C\u002Fa> replaces \u003Ccode>esx_notify\u003C\u002Fcode> · \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-progressbar\u002F\">X3D Progress Bar\u003C\u002Fa> replaces \u003Ccode>esx_progressbar\u003C\u002Fcode> · \u003Ca href=\"\u002Fen\u002Fproducts\u002Fx3d-loadingscreen\u002F\">X3D Loading Screen\u003C\u002Fa> replaces \u003Ccode>esx_loadingscreen\u003C\u002Fcode>. The forwarder-based switch is in the \u003Ca href=\"\u002Fen\u002Fblog\u002Fesx-ui-replacements\u002F\">stock ESX UI comparison\u003C\u002Fa>.\u003C\u002Fp>\n\u003Cp>For players whose FPS is low on every server (not just yours), send them \u003Ca href=\"\u002Fen\u002Fblog\u002Ffivem-fps-boost\u002F\">FiveM low FPS fixes\u003C\u002Fa> to tune their PC.\u003C\u002Fp>\n\u003Ch2 id=\"want-a-branded-ui\">Want a branded UI?\u003C\u002Fh2>\n\u003Cp>Only need a new inventory screen? A free one built on these rules: \u003Ca href=\"\u002Fen\u002Fblog\u002Ffivem-esx-inventory-vault-trunk\u002F\">free FiveM inventory UI with vaults and trunks\u003C\u002Fa>.\u003C\u002Fp>\n\u003Cp>For a HUD, menu or inventory designed for your server, X3D builds \u003Ca href=\"\u002Fen\u002Fservices\u002Fui-design\u002F\">custom UI\u002FNUI in Vue\u003C\u002Fa> following the rules in this post: embedded fonts, no outbound requests, change-only messages, \u003Ccode>resmon\u003C\u002Fcode> measured before delivery.\u003C\u002Fp>\n\u003Ch2 id=\"faq\">FAQ\u003C\u002Fh2>\n\u003Cp>\u003Cstrong>Changed the HUD, still laggy?\u003C\u002Fstrong> Measure \u003Ccode>resmon\u003C\u002Fcode> again. The eater is usually not the HUD but a script looping on \u003Ccode>Wait(0)\u003C\u002Fcode>, such as one drawing 3D markers for every point in the city at once.\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Do graphics settings help?\u003C\u002Fstrong> They help the game, not the NUI. NUI runs on CPU\u002FChromium separately from the game renderer.\u003C\u002Fp>\n\u003Cp>\u003Cstrong>Can I disable all NUIs?\u003C\u002Fstrong> Only while debugging: \u003Ccode>stop\u003C\u002Fcode> them one by one, or use \u003Ccode>nui_devtools\u003C\u002Fcode> to profile each page.\u003C\u002Fp>\n",[23,27,33,39],{"slug":24,"title":25,"description":26,"date":20},"esx-ui-replacements","Replace esx_notify, esx_progressbar and esx_loadingscreen with X3D's free UI set — without touching old scripts","esx_notify has 4 positions and no Thai font, esx_progressbar cannot be cancelled, esx_loadingscreen white-screens on some machines. A side-by-side of stock ESX UI against X3D Notify, X3D Progress Bar and X3D Loading Screen (free, GPL v3), and how to switch while scripts that call the old exports keep working unchanged.",{"slug":28,"title":29,"description":30,"date":31,"updated":32},"open-fivem-server-budget","How Much Does It Cost to Open a FiveM Server, and What Do You Need? From 32 Players to a 2,000-Player City (2026)","The essential scripts to launch a FiveM server in 2026 with budgets at three scales: starter 32–64, public 128–500, and a 1,000–2,048-player city (Element Club Platinum, dedicated hardware, separate voice and database, staff). Which parts free scripts cover, which are worth paying for, and which must be rewritten once you reach two thousand players.","2026-09-15","2026-10-14",{"slug":34,"title":35,"description":36,"date":37,"updated":38},"free-fivem-scripts","27 Free FiveM Scripts From the Developer: Weapon Skins, Weapon Damage, ESX Inventory, Vaults, Admin Panel and More","Twenty-seven free FiveM scripts from X3D — collectible weapon skins, a weapon damage system, ESX inventory with hotkeys 1–9, vaults, trunk storage, an admin panel with token bans, bank and ATM, YouTube boombox, fortune teller with siamsi and tarot, ESX phone, death screen, drug selling, house robbery, minigames, ESX Legacy Core X3D Build, loading screen, Notify, Progress Bar, usable items, slide, Character Skin, Main Menu, Daily Login, Mailbox, Carry and Environment.","2026-09-18","2026-10-11",{"slug":40,"title":41,"description":42,"date":20,"updated":43},"fivem-stuck-loading-screen","FiveM Stuck on Loading Screen? 8 Fixes for Players, 5 for Server Owners","FiveM stuck on the loading screen, on the Rockstar launcher, on Connecting, or on a loading screen with music playing; black screen, white screen, loading never finishes. Step-by-step fixes for players (clear cache, move to SSD, disable ReShade, verify game files) and the server-side causes only the owner can fix (white loading screen, a client resource erroring at boot, the core spawning players before the world is ready).","2026-09-27",[45,46,47],"x3d-progressbar","x3d-notify","x3d-loadingscreen",{"site":49,"contact":51,"seo":52,"payment":53},{"name":5,"host":6,"default_locale":7,"locales":50},[7,9],{"discord_invite":11,"email":12,"line":12},{"google_site_verification":12,"bing_site_verification":12},{"bank_name":12,"account_name":12,"account_no":12,"promptpay_id":12},[55,88,114],{"id":56,"slug":45,"name":57,"summary":58,"price_thb":59,"license_mode":60,"cover_key":61,"cover_url":62,"category_slugs":63,"tags":65,"latest_version":83,"latest_released_at":84,"published_at":85,"has_docs":86,"config":60,"rent_price_satang":87},"8c823bc1-1de6-41b6-bf82-146d5a55eeb5","X3D Progress Bar","A peach-themed progress bar with ESC to cancel, a countdown, an automatic hotkey lock, and a bundled Thai font.",0,"none","public\u002Fproducts\u002Fx3d-progressbar\u002Fcover\u002Ff6830df60f656452.jpg","\u002Fapi\u002Fv1\u002Fmedia\u002Fpublic\u002Fproducts\u002Fx3d-progressbar\u002Fcover\u002Ff6830df60f656452.jpg",[64],"hud",[66,67,68,69,70,71,72,64,73,74,75,76,77,78,79,80,81,82],"progressbar","progress bar","แถบโหลด","แถบความคืบหน้า","esx_progressbar","esx progressbar","ui","ยกเลิก esc","esx","ฟรี","free","หลอดโหลด","ฟอนต์ไทย","นับเวลาถอยหลัง","ล็อกปุ่มลัด","โปรเกรสบาร์","แทน esx_progressbar","1.1.3","2026-10-12T17:19:45.934106Z","2026-09-24T01:22:17.768991Z",false,null,{"id":89,"slug":46,"name":90,"summary":91,"price_thb":59,"license_mode":60,"cover_key":92,"cover_url":93,"category_slugs":94,"tags":95,"latest_version":109,"latest_released_at":110,"published_at":111,"has_docs":112,"config":113,"rent_price_satang":87},"9b62b8ed-5911-47a8-b695-3320a6183758","X3D Notify","Notification cards in nine positions, with item icons and rarity frames, and full Thai support.","public\u002Fproducts\u002Fx3d-notify\u002Fcover\u002F4a9cbdcedd86a149.jpg","\u002Fapi\u002Fv1\u002Fmedia\u002Fpublic\u002Fproducts\u002Fx3d-notify\u002Fcover\u002F4a9cbdcedd86a149.jpg",[64],[96,97,98,99,100,101,72,64,78,102,74,75,76,103,104,105,106,107,108],"notify","notification","แจ้งเตือน","แจ้งเตือน fivem","esx_notify","esx notify","ไอคอนไอเทม","การ์ดแจ้งเตือน","กรอบความหายาก","แจ้งเตือน 9 ตำแหน่ง","สีในข้อความ","แทน esx_notify","แจ้งเตือนไอเทม","1.1.4","2026-10-12T17:20:21.047259Z","2026-09-24T01:21:40.547491Z",true,"public",{"id":115,"slug":47,"name":116,"summary":117,"price_thb":59,"license_mode":60,"cover_key":118,"cover_url":119,"category_slugs":120,"tags":121,"latest_version":133,"latest_released_at":134,"published_at":135,"has_docs":112,"config":60,"rent_price_satang":87},"e6dc80f3-4f29-4d01-bffa-eba6829c6497","X3D Loading Screen","A terminal-style loading screen with an ENTER WORLD button the player presses before spawning. One HTML file, no build step.","public\u002Fproducts\u002Fx3d-loadingscreen\u002Fcover\u002F32f1538b8e18f4db.jpg","\u002Fapi\u002Fv1\u002Fmedia\u002Fpublic\u002Fproducts\u002Fx3d-loadingscreen\u002Fcover\u002F32f1538b8e18f4db.jpg",[64],[122,123,124,125,126,127,72,128,74,75,76,129,130,77,131,132],"loading screen","หน้าโหลด","หน้าโหลด fivem","loadingscreen","esx_loadingscreen","enter world","standalone","ปุ่มเข้าเมือง","หน้าโหลดเทอร์มินัล","พื้นหลังวิดีโอ","เพลงหน้าโหลด","1.0.5","2026-10-12T17:20:39.269405Z","2026-09-24T00:50:19.336351Z",1792316317523]