ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar

Rspack v0.7.1: up to 15% faster JavaScript parsing
https://github.com/web-infra-dev/rspack/releases/tag/v0.7.1

ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar
ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar

ECMAScript 2024 features: resizing and transferring ArrayBuffers
@rauschma
https://2ality.com/2024/06/array-buffers-es2024.html

ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar

Prettier 3.3: better formatting for import attributes, property keys, template interpolations, etc.
https://prettier.io/blog/2024/06/01/3.3.0.html

ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar

Turborepo 2.0: new terminal UI, watch mode, new documentation and more
https://turbo.build/blog/turbo-2-0

ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar
ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar

regex: template tags that help with creating RegExps and provide advanced features
https://github.com/slevithan/regex

ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar
ecmascript_news, to javascript
@ecmascript_news@mastodon.online avatar
jensimmons, to CSS
@jensimmons@front-end.social avatar

Web developers and designers,

What are you hoping to see at WWDC next week??

#css #html #javascript #webdevelopment

64bithero, to javascript
@64bithero@mstdn.games avatar

Anyone else here tried using Vite to create an SDK for other apps to use ?? Struggle bussing getting it to render anywhere externally :hmm_cat:
#developer #vite #javascript #help

aral, (edited ) to SmallWeb
@aral@mastodon.ar.al avatar

:kitten: Say hello to the new Kitten web site! 🎉

https://kitten.small-web.org

Like Kitten itself, it’s a baby but will be evolving quickly as they approach API version 1 together.

Enjoy!

💕

PS. Of course it’s written in Kitten itself. It doesn’t do anything fancy but here’s the source code if you’re interested: https://codeberg.org/kitten/site

toxi, to opensource
@toxi@mastodon.thi.ng avatar

Since I've just been asked again why some of the https://thi.ng/umbrella examples in the repo are not working when copy/pasting the source code into a new (external, I assume) project — there could be several reasons...

  1. The default branch of the repo is develop and usually does contain code which hasn't been released yet (as library/package). If in doubt, please switch to the main branch which contains the state as of the most recent release cycle...

  2. Related to #1, there could be breaking API changes on the develop branch (as is the case for the current major undertaking of thi.ng/geom v8.0.0) and some of the examples are already using the new/upcoming API...

  3. Rare, but possible, I've forgotten to declare dependencies for an example and you might encounter broken imports. Since 2022 I've got a custom tool to verify imports and exports of all packages and examples (and which is run prior to each release), so this shouldn't happen anymore...

  4. Personally, I'm only using a bundler setup/workflow (@vite) and had zero problems in the past few years. However, some people using ESM imports directly have been encountering weird issues with some transpilation features of JS CDNs (e.g. skypack) in the past, but these shouldn't happen with more modern ones like https://esm.run.

Finally, all packages have a generally uniform readme structure, incl. "install/import instructions". For examples, there're also these wiki pages:

General:
https://github.com/thi-ng/umbrella/wiki/Example-build-instructions

For examples added since late 2023:
https://github.com/thi-ng/umbrella/wiki/Development-mode-for-examples-using-thi.ng-meta%E2%80%90css

#ThingUmbrella #Documentation #Examples #OpenSource #TypeScript #JavaScript #ESM

minioctt, to webdev Italian

Ieri sera, una roba che davvero mi ha fatto perdere la pazienza e ogni speranza, maledetto web development, avevo iniziato a scrivere questo post ma ho poi deciso di a mimire… in pratica, il Canvas HTML5 è inconsistente, tra diverse funzioni, diversi browser, e a tratti è proprio buggato mi sa. In breve: non si può tracciare linee o contorni puliti lì dentro, viene tutto sfocato, mannaggia!!! 😶‍🌫️️

Beh, non è la prima volta che scopriamo che la roba nei browser gira a furia di hack, quindi non so perché proprio questa volta sono così spiazzata, però questo è. Ho scoperto questa magagna dopo aver notato che, i bordi di rettangoli nel programma che sto facendo, che sono puliti su Firefox, appaiono tutti blurrati in Chromium. Ho fatto qualche test al volo, e notato che cambiare lo spessore dei tratti sistemava il problema su un browser e lo faceva apparire sull’altro. “Sarà colpa di p5.js“, ho pensato, “ti pare che nei due browser web più grandi al mondo ci sono gli spacc?“… e quindi ho cercato. Big oopsie, perché una issue l’ho trovata, ma da lì ho scoperto che p5.js in realtà non centra. E… ecco, facendo dei test con la API Canvas liscia, senza la libreria esterna di mezzo, persiste il problema. 👹️

https://octospacc.altervista.org/wp-content/uploads/2024/06/image-2.pngHo fatto un piccolo file con vari test: jsbin.com/dadobugiye/ (caricato su JSBin, così potete verificare anche voi). In foto c’è a sinistra come ha renderizzato Firefox, e a destra Chromium (entrambi chiaramente sul mio desktop Linux). Tra le quattro linee spesse da 1 a 4 pixel, e i tre rettangoli con bordo da 1 a 3 pixel, notate come a spessore alternato si alternano anche la presenza e l’assenza di sfumatura. Quello che cambia tra la copia superiore e quella inferiore è che sulla seconda è applicato uno shift di 0.5 pixel sia per X che Y (la seconda soluzione più brutta tra le consigliate)… appunto, fare questa cagata pulisce ciò che prima era sporco e sporca ciò che era pulito. 🚬️La schifezza è dovuta al fatto che il browser fa anti-aliasing di ciò che disegna lui, e non c’è modo di disattivare la cosa; c’è una proprietà imageSmoothingEnabled che vale però solo per i dati immagine raw (forse è per questo che non ho mai notato problemi con, ad esempio, gli emulatori web di console). Quindi, in teoria si potrebbero implementare da zero funzioni per disegnare linee e roba varia, che scrivono direttamente i pixel sulla tela… ma non sembra qualcuno abbia voglia di implementarlo in librerie grafiche general-purpose e che non deviano troppo dalla API. (Io certamente no.) Shiftare ogni azione di disegno di 0.5 pixel in base al browser può sembrare una soluzione (dato che il problema è causato dall’allineamento subpixel, e ci sarebbe il metodo .translate(x,y) per farlo senza ogni volta sommare alle coordinate), ma non lo è affatto, perché lo vedete come le linee e i rettangoli appaiono tra loro diversi (e, curiosamente, le linee sono uguali tra i due browser)… 💱️

Computer potentissimi e piattaforme software di complessità estrema e potenzialità infinite, ma poi non riescono a fare delle fottutissime linee non sburrate, stiamo tornando indietro. E falliscono appunto in modo pure inconsistente!!! Non sembra proprio esserci soluzione, se non creare delle mie astrazioni sulle funzioni di disegno di linee e rettangoli (che fanno in autonomia gli shift necessari ogni volta). Veramente sto male, è possibile che se il mio numero arbitrario di spessore in pixel è pari o dispari, a seconda del gusto del browser e dell’allineamento .0 o .5 a subpixel, deve venire tutto: o grigino anziché nero, o spesso di 2 pixel anziché 1 (o la qualsiasi), o coi bordi sciolti in lava? Per ora continuo a usare p5.js e quindi il disegno a forme sul Canvas per questa applicazione, perché è comodo, ma per i prossimi progetti chissà che dovrei usare… nulla si avvicina neanche lontanamente all’efficienza di scrivere del JavaScript vanilla e averlo immediatamente prendere vita. 🤢️

https://octospacc.altervista.org/wp-content/uploads/2024/06/image-4.pngHo provato anche un’altra soluzione di tizi, un po’ brutta ma che avrei accettato se avesse funzionato: applicare un dato filtro SVG… che dire. Vero, non si vede più alcuna sbleurratura, ma gli angoli dei tratti sono più arrotondati (non chiesi), e lo spessore è comunque sbagliato. E una cosa stramba bonus: i lati delle linee superiori (ma non di quelle shiftate?!) sono tipo corrotti, hanno dei pixel che appaiono un po’ a sinistra come delle spine. Ma come cazzo è possibile?!?!?! 🌋️https://octospacc.altervista.org/2024/06/07/tela-spaccata/

image/png

kubikpixel, (edited ) to webdev
@kubikpixel@chaos.social avatar

A other web tool with the name @lume but a 3D web design from @trusktr.

Do any of you use this and what is your experience with it? It is probably based on three.js and I hope it makes it "easier" to implement.

🧊 https://lume.io


#webdev #3dweb #webdesign #threejs #lume #html #javascript #typescript #3d

khalidabuhakmeh, to javascript
@khalidabuhakmeh@mastodon.social avatar

I’m about to make many #JavaScript developers feel very old. Apologies in advance.

https://mootools.net/

siblingpastry, (edited ) to Logic
@siblingpastry@mastodon.world avatar

Question about in -- is there a simpler / more compact way of expressing this condition?

(A && !B) || (B && !A)

leanpub, to javascript
@leanpub@mastodon.social avatar

You Don't Know JS Yet: Get Started: Get to know JS https://leanpub.com/ydkjsy-get-started by Kyle Simpson is the featured book on the Leanpub homepage! https://leanpub.com @getifyX

cspray, to javascript
@cspray@phpc.social avatar

One time I found some in an app that was constructing a full blown SELECT statement in SQL, sending it to the server, and then blindly executed on that server.

It is still the most glorious, beautiful code I've ever seen.

siblingpastry, to javascript
@siblingpastry@mastodon.world avatar

TIL that range modifications on the window selection object are asynchronous, eg. removeAllRanges().

This can lead to race conditions, but the methods don't return a Promise, so if the timing matters you have to use selectionchange as a callback trigger.

#javascript

davidbisset, to webdev
@davidbisset@phpc.social avatar

"Here’s What We Learned From the First State of #HTML Survey"

https://frontendmasters.com/blog/state-of-html-2023-results-2

"...when asked how they allocated their time between writing HTML/#CSS and JavaScript/TypeScript code, 59% said they spent more than half their time writing #JavaScript – even though the survey was clearly aimed at people interested in HTML."

davidbisset, to Laravel
@davidbisset@phpc.social avatar
leanpub, to react
@leanpub@mastodon.social avatar

Building Large Scale Web Apps: A React field guide https://leanpub.com/large-scale by Addy Osmani and Hassan Djirdeh is the featured book on the Leanpub homepage! https://leanpub.com @addyosmani

baumannzone, to javascript Spanish
@baumannzone@techhub.social avatar
janriemer, to rust

C++ will be taken over by #Rust.

What will be the Rust-equivalent for #JavaScript?

I mean #TypeScript is a very good first step, but it's basically the C++ for C.

So in short:
C => C++
JavaScript ≈> TypeScript
C++ => #RustLang
JavaScript => ???

I think it will be a looong way to go, but maybe, maybe we'll see more and more #WebAssembly in the #frontend, but not quite sure yet.

#WASM #ProgrammingLanguage #CPlusPlus #C

janriemer,

@alcinnz Remember the discussion we had regarding and (see above☝️)?

Well, someone (@face) made "an alternative for the World Wide Web" called "Bussin Web X".

Websites are made of HTML, CSS and...guess what, Lua! :awesome:

Repo:
https://github.com/face-hh/webx

(Funny) video by FaceDev about its creation:
https://invidious.reallyaweso.me/watch?v=qiOtinFFfk8
(or YT: https://www.youtube.com/watch?v=qiOtinFFfk8)

I thought, you might be interested. 😉

  • All
  • Subscribed
  • Moderated
  • Favorites
  • JUstTest
  • mdbf
  • everett
  • tacticalgear
  • magazineikmin
  • thenastyranch
  • rosin
  • tester
  • Youngstown
  • khanakhh
  • slotface
  • ngwrru68w68
  • kavyap
  • DreamBathrooms
  • megavids
  • InstantRegret
  • osvaldo12
  • GTA5RPClips
  • ethstaker
  • normalnudes
  • Durango
  • cisconetworking
  • anitta
  • modclub
  • cubers
  • Leos
  • provamag3
  • lostlight
  • All magazines